CODEWITHSUNDEEP
jquerycssflexslider
Jhig85
Jhig85

Reputation: 355

Syncing Carousel and Slider to use the same directionNav in Flexslider

I am trying to figure out if it is possible in Flexslider to sync up the Carousel and the Slider and have them use the directionNav in the carousel to control both. I would like it to make the carousel slides and the Slider slides change when you click the previous and next arrows. I have researched and asked on the Github for Flexslider without luck. Anyway, here is the script I am using as of right now:

'<script type="text/javascript">
    $(function(){
      SyntaxHighlighter.all();
    });
    $(window).load(function(){
      $('#carousel').flexslider({
        animation: "slide",
        controlNav: false,
        directionNav: true,
        animationLoop: false,
        slideshow: false,
        itemWidth: 150,
        itemMargin: 5,
        asNavFor: '#slider'
      });

      $('#slider').flexslider({
        animation: "slide",
        controlNav: false,
        directionNav: false,
        animationLoop: false,
        slideshow: false,
        sync: "#carousel",
        start: function(slider){
          $('body').removeClass('loading');
        }
      });
    });
  </script>

Any help is appreciated.

Upvotes: 0

Views: 2653

Answers (2)

sonam
sonam

Reputation: 3760

there is a demo at http://flexslider.woothemes.com/thumbnail-slider.html which shows how you can sync up with carousel

Upvotes: 0

nardocesar
nardocesar

Reputation: 91

Bro, do you REALLY have to use Flexslider? Cycle2 looks better to do that http://jquery.malsup.com/cycle2/

Upvotes: 1

Related Questions