Jump to content

FishEye menu conflict with autoslider


10eIOSweb
 Share

Recommended Posts

I created a fisheye menu and it was working well, until I added an autoslider that uses a different JQuery library version.Now the slider works, but not the fisheye menu. I tried adding the NoConflict, but it didn't work. This is my website: http://www.wedub4u.com/ This is the relevant code at the head of my document: <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js">var jq132 = jQuery.noConflict();</script><script type="text/javascript" src="js/fisheye-iutil.min.js">var jq132 = jQuery.noConflict();</script><script type="text/javascript" src="js/dock-example1.js">var jq132 = jQuery.noConflict();</script> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.0/jquery.min.js">var jq160 = jQuery.noConflict();</script><script type="text/javascript" src="js/simplegallery.js">var jq160 = jQuery.noConflict();</script> <!--* Simple Controls Gallery- © Dynamic Drive DHTML code library (www.dynamicdrive.com)* This notice MUST stay intact for legal use* Visit Dynamic Drive at http://www.dynamicdrive.com/ for this script and 100s more--> <script type="text/javascript">var jq160 = jQuery.noConflict();var mygallery=new simpleGallery({wrapperid: "simplegallery1", //ID of main gallery container,dimensions: [1020, 600], //width/height of gallery in pixels. Should reflect dimensions of the images exactlyimagearray: [["http://wedub4u.com/images/slider/1.png", "http://wedub4u.com/index.html", "_new", "description"],["http://wedub4u.com/images/slider/2.png", "http://wedub4u.com/index.html", "_new", ],["http://wedub4u.com/images/slider/3.png", "http://wedub4u.com/index.html", "_new", ],["http://wedub4u.com/images/slider/4.png", "http://wedub4u.com/index.html", "_new", "description"]],autoplay: [true, 2500, 10], //[auto_play_boolean, delay_btw_slide_millisec, cycles_before_stopping_int]persist: false, //remember last viewed slide and recall within same session?fadeduration: 2000, //transition duration (milliseconds)oninit:function(){ //event that fires when gallery has initialized/ ready to run//Keyword "this": references current gallery instance (ie: try this.navigate("play/pause"))},onslide:function(curslide, i){ //event that fires after each slide is shown//Keyword "this": references current gallery instance//curslide: returns DOM reference to current slide DIV (ie: try alert(curslide.innerHTML)//i: integer reflecting current image within collection being shown (0=1st image, 1=2nd etc)}}) var jq132 = jQuery.noConflict(); </script> And this is the code at the body for both elements:Fisheye Menu <!-- BEGIN DOCK 1 ============================================================ --><div id="dock"> <div class="dock-container"> <a class="dock-item" href="index.html"> <span>Home</span> <img src="http://wedub4u.com/images/icons/menu1/homesm.png" alt="home"/> </a> <a class="dock-item" href="#map"> <span>Sitemap</span> <img src="http://wedub4u.com/images/icons/sitemap.png" alt="sitemap"/> </a> <a class="dock-item" href="index.html"> <span>About</span> <img src="http://wedub4u.com/images/icons/about.png" alt="about"/> </a> <a class="dock-item" href="index.html"> <span>Portfolio</span> <img src="http://wedub4u.com/images/icons/menu1/portfsm.png" alt="portfolio"/> </a> <a class="dock-item" href="#contact"> <span>Contact</span> <img src="http://wedub4u.com/images/icons/menu1/email2sm.png" alt="contact"/> </a> <a class="dock-item" href="index.html"> <span>Promotions</span> <img src="http://wedub4u.com/images/icons/menu1/dealssm.png" alt="deals"/> </a> <a class="dock-item" href="index.html"> <span>Store</span> <img src="http://wedub4u.com/images/icons/menu1/storesm.png" alt="store"/> </a> </div><!--end div .dock-container--></div><!--end div .dock #dock--><!-- END DOCK 1 ============================================================ --> SLIDER <div id="slider"> <div id="simplegallery1"></div> </div> <!--end div slider--> Any suggestions?

Link to comment
Share on other sites

Remove ALL the var blah = jQuery.noConflict() and just use the latest/newer version of jquery, its backward compatible

    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.0/jquery.min.js"></script>        <script type="text/javascript" src="http://wedub4u.com/js/fisheye-iutil.min.js"></script>    <script type="text/javascript" src="http://wedub4u.com/js/dock-example1.js"></script>        <script type="text/javascript" src="http://wedub4u.com/js/simplegallery.js"></script>

Link to comment
Share on other sites

Remove ALL the var blah = jQuery.noConflict() and just use the latest/newer version of jquery, its backward compatible
THANKS, for the suggestion. I have done that, but the Fisheye menu is still not working. I think that is not calling the function properly, but I don't know how to fix it.
Link to comment
Share on other sites

THANKS, for the suggestion. I have done that, but the Fisheye menu is still not working. I think that is not calling the function properly, but I don't know how to fix it.
Thank you. I just fix it. I just had to put first the script call for the gallery and then the fisheye. Thank you very much.
Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
 Share

×
×
  • Create New...