Hey there. I got a problem with the jquery cycle plugin. I wanna have a div with thumbnails in it. that cycle and also use the pager function od the plugin. I also wanna have a div with the bigger images that also cycle and should also be accesable with the same pager. When I click on the thumbnail the div with the bigger image shows up and when I click on the bigger image it fades out. the problem is, that when i click on a number in the pager, the thumbs are cycling but the bigger images are not. if I click on the nextbutton both divs are cycling. My question is can I use the same pager for more than one div? if so, how can i get it to work?
here's my jQuery: $('#gastroThumbs').cycle({ fx: 'fade', speed: 500, timeout: 0, next: '#next', pager: '#thumbNav' }), $('#gastroBilder').cycle({ fx: 'fade', speed: 500, timeout: 0, next: '#next', pager: '#thumbNav' }); $('#gastroThumbs a img').click(function(){ $('#gastroBilder').fadeIn('300'); $('#gastroThumbs a img').fadeOut('300'); }); $('#gastroBilder').click(function(){ $(this).fadeOut('300'); $('#gastroThumbs a img').fadeIn('300'); }); that's my html: <div id="gastroThumbs"> <a href="#"><img src="img/gastro1.jpg" /></a> <a href="#"><img src="img/gastro2.jpg" /></a> <a href="#"><img src="img/gastro3.jpg" /></a> <a href="#"><img src="img/gastro4.jpg" /></a> <a href="#"><img src="img/gastro5.jpg" /></a> </div> <div id="nexter"><a href="#" id="next">></a></div> <div id="thumbNav"></div> <div id="gastroBilder"> <img src="img/gastro1_gross.jpg" /> <img src="img/gastro2_gross.jpg" /> <img src="img/gastro3_gross.jpg" /> <img src="img/gastro4_gross.jpg" /> <img src="img/gastro5_gross.jpg" /> </div><!-- end bilder --> can anybody help, please?!