Hi there -
I’m developing a site, and am having trouble implementing the superfish jquery plugin on the same page as an instance of fancybox. I have the menu system working on any page that does not initialize the fancybox plugin however in order to do this I was referencing jquery-1.2.6.min.js. Even though it says it suports later version of jquery.
The fancybox plug in is calling jquery.min.js v 1.4 from the CDN at googleapis.com and it works using this verion of jquery. I’m using this plug in on only two specific pages, but the problem that I am encountering is that on these pages my navagation bar is so longer using the superfish javascript to interact with the menu and is reverting to a pure css menu.
If I try to run fancybox from the earlier version of jquery it doesn’t work at all.
I’m a novice to web development and am primarily a graphic designer and so I’m sure I’m doing something wrong so if anyone can help me figure it out please let me know. I am pasting the code that I’m using to initialize the scripts as well, and if there is any other information someone would need to help with this issue, please let me know and I will post that as well. thanks
Code that intializes the superfish and hoverIntent javascript:
<link rel="stylesheet" href="[(site_url)]index.php?id=56" type="text/css" media="screen" />
<link rel="stylesheet" href="[(site_url)]index.php?id=58" type="text/css" media="screen" />
<script type="text/javascript" src="assets/superfish/jquery-1.2.6.min.js"></script>
<script type="text/javascript" src="assets/superfish/hoverIntent.js"></script>
<script type="text/javascript" src="assets/superfish/superfish.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("ul.sf-menu").superfish({
animation: {opacity:'show',height:'show'},
pathClass: 'active',
pathLevels: 1
});
});
</script>
Code that intializes the fancybox javascript:
<link rel="stylesheet" href="assets/fancybox/jquery.fancybox-1.3.1.css" type="text/css" media="screen" />
<!-- <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>-->
<script type="text/javascript" src="assets/fancybox/jquery.fancybox-1.3.1.pack.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$('a.lightbox').fancybox();
});
</script>