Merdok Posted December 14, 2010 Share Posted December 14, 2010 Hi Guys, I've been using PHP for years now and I've gotten reasonably good at it but I'm now in the process of trying to learn jQuery. I'm trying to build a navigable image cycle, so far the cycle itself works quite nicely, but I want to be able to click on a number and have it move the slideshow to the related item. Here is the code I have so far: this.imageList = $('<ul class="theCycle"><li class="slideOne"><a href="/services/localisation"><img src="../../elements/imageCycle/imgCycle1.jpg"></a></li><li class="slideTwo"><a href="/services/technical-translation"><img src="../../elements/imageCycle/imgCycle2.jpg"></a></li><li class="slideThree"><a href="/services/proofreading--qa"><img src="../../elements/imageCycle/imgCycle3.jpg"></a></li><li class="slideFour"><a href="/services/desktop-publishing"><img src="../../elements/imageCycle/imgCycle4.jpg"></a></li></ul>'); this.navigation = $('<ul class="numNav"><li class="one">1</li><li class="two">2</li><li class="three">3</li><li class="four">4</li></ul>').appendTo('.imageCycle'); this.slide = function() { $('.imageCycle').find('.theCycle li').first().animate({ 'opacity' : 0 } ,'slow', function() { $(this).appendTo('.theCycle').animate({'opacity' : 1}); }); $('.numNav li').click( function() { if( $(".one").imageList.find(".slideOne").appendTo("imageCycle")); if( $(".two").imageList.find(".slideTwo").appendTo("imageCycle")); if( $(".three").imageList.find(".slideThree").appendTo("imageCycle")); if( $(".four").imageList.find(".slideFour").appendTo("imageCycle")); }); } I've no doubt I've done this terribly (I'm open to suggestions) and I DO place to replace the 4 'if' statements with a switch (assuming Javascript has them) but I'm completely baffled as how to get the correct slide to appear when you click on the correct number. Any help would be much appreciated. Quote Link to comment https://forums.phpfreaks.com/topic/221666-image-cycle-not-working-beginner-to-jqueryjscript/ Share on other sites More sharing options...
brianlange Posted December 15, 2010 Share Posted December 15, 2010 Do you have a url where this is being displayed? It's hard for me to help with the existing code. Quote Link to comment https://forums.phpfreaks.com/topic/221666-image-cycle-not-working-beginner-to-jqueryjscript/#findComment-1147497 Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.