Flexslider - using 'asnavfor' - how to make navigation carousel starting from the second slide, skipping the 1st slide

Question

     jQuery('#carousel').flexslider({
        animation: "slide",
        controlNav: false,
        animationLoop: false,
        slideshow: false,
        itemWidth: 150,
        itemMargin: 5,
        asNavFor: '#slider'
     });

     jQuery('#slider').flexslider({
        animation: "slide",
        controlNav: false,
        animationLoop: false,
        slideshow: false,
        sync: "#carousel",
        smoothHeight: true
     });

I need to make 1st item in "#carousel" to be linked with 2nd item in "#slider".

Answer 1

Solved, maybe a little dirty solution but it works - here's how

Added empty li inside the #carousel ul, and assigned class "hidden" to it, like this:

<ul class="slides">
   <li class="hidden"></li>
   <li>slide-hidden+1</li>
   <li>slide-hidden+2</li>
  <li>slide-hidden+n</li>
</ul>

than adjust the flexslider css code with this:

 li.hidden, li.hidden.flex-active-slide {
    display:none !important; 
    width:0px !important;
 }

This way the first thumbnail will always be hidden, and the slider navigation will start from the 2nd slide.