jquery - flexsliderマルチコントロールナビゲーション

Question

このシナリオでは、flexsliderの単一インスタンスが使用されていますが、2つのコントロールナビゲーション（2 x controlNavで、directionNavなし）で動作する必要があります。デザインには、スライダーの上部にあるコントロールナビゲーションとスライダーにあるコントロールナビゲーションが必要です。どちらも機能的には同じで、スタイルが異なります。

スライダーを2つのナビゲーションで動作させることができません。jqueryのクローンと、flexsliderのsync関数とasNavFor関数を使用する次のコードの両方を使用してみました。

このサイトはhttp://virtual1.blueplanetdns.comにあります。

<?php
if( function_exists('get_field') ){

    if(get_field('slider_item')): ?>

    <?php if(get_field('slide_interval')) 
    {
        $interval = get_field('slide_interval');
        $intervalMultiplied = $interval * 1000 ; 
    }
    else
    {
        $intervalMultiplied = '5000';
    }
    ?>

    <script type="text/javascript">
        $(window).load(function() {
            $('.flexslider-manual-controls-second').flexslider({
                directionNav: false,
                controlNav: false,
                asNavFor: ".flexslider"
          });
        });
    </script>

    <script type="text/javascript">
        $(window).load(function() {
            $('.flexslider').flexslider({
              animation: "fade",
              //controlsContainer: ".flexslider-container",
              manualControls: ".flexslider-manual-controls li a",
              directionNav: false,
              slideshow: true,
              slideshowSpeed: <?php echo $intervalMultiplied; ?>,
              animationLoop: true,           
              pauseOnAction: false,
              pauseOnHover: true,
              sync: ".flexslider-manual-controls-second"
          });
        });
    </script>

    <div class="flexslider-container clearfix">

        <div class="flexslider-manual-controls-second">
            <ul class="slides">
                <?php while(has_sub_field('slider_item')): ?>
                    <li class="secondaryNav-item">
                    </li>       
                <?php endwhile; ?> 
            </ul>
        </div>

        <div class="flexslider">
            <ul class="slides">
                <?php while(has_sub_field('slider_item')): ?>
                    <?php
                    //Image 
                    $attachment_object = get_sub_field('slider_background_image');
                    $size = "slider";
                    //var_dump($attachment_object);

                    $image_url = wp_get_attachment_image_src( $attachment_object['id'], $size );
                    //var_dump($image_url);
                    //$image_title = $attachment_object['title'];
                    //$image_alt = $attachment_object['alt'];
                    //$image_description = $attachment_object['description'];
                    ?>
                    <li class="slider-item" style="background:url('<?php echo $image_url[0]; ?>') no-repeat left top;">
                        <div class="slider-content">
                            <?php if(get_sub_field('slider_title')) echo '<h2 class="slider-title">'.get_sub_field('slider_title').'</h2>'; ?>
                            <?php if (get_sub_field('slider_link')) echo '<a class="slider-link" href="'.get_sub_field('slider_link').'">Find out more</a>'; ?>
                        </div>
                    </li><!-- end slide-item -->       
                <?php endwhile; ?> 
            </ul>

            <ul class="flexslider-manual-controls">
                <?php while(has_sub_field('slider_item')): ?>

                    <li class="nav-item">
                        <a href="#"><?php echo get_sub_field('slider_tab_title'); ?></a>
                    </li>

                <?php endwhile; ?>
            </ul>

        </div>                            
    </div>          
<?php 
endif; 

}
?>                                                                              

ありがとう