по инструкции сделал 3 пункта)
Slider w/thumbnail slider
JS
$(window).load(function() { // The slider being synced must be initialized first $('#carousel').flexslider({ animation: "slide", controlNav: false, animationLoop: false, slideshow: false, itemWidth: 210, itemMargin: 5, asNavFor: '#slider' }); $('#slider').flexslider({ animation: "slide", controlNav: false, animationLoop: false, slideshow: false, sync: "#carousel" }); });
html
<!-- Place somewhere in the <body> of your page --> <div id="slider" class="flexslider"> <ul class="slides"> <li> <img src="slide1.jpg" /> </li> <li> <img src="slide2.jpg" /> </li> <li> <img src="slide3.jpg" /> </li> <li> <img src="slide4.jpg" /> </li> <!-- items mirrored twice, total of 12 --> </ul> </div> <div id="carousel" class="flexslider"> <ul class="slides"> <li> <img src="slide1.jpg" /> </li> <li> <img src="slide2.jpg" /> </li> <li> <img src="slide3.jpg" /> </li> <li> <img src="slide4.jpg" /> </li> <!-- items mirrored twice, total of 12 --> </ul> </div>