Jquery循环:不能在幻灯片中导航

我试图用jQuery循环做一个滑块，当你点击5个缩略图之一时，你切换到滑块中的右侧滑动。拇指在滑块的外部。

事情是，由于某种原因，startingSlide参数不起作用，仅仅做。cycle(number)也不起作用，即使滑动条明显在运行。下面是代码的一部分:

JS

        jQuery(document).ready(function(){
        var current_slide;
        jQuery('#slider_accueil').cycle({ 
            fx:     'fade',
            timeout: 3000,
            after: onAfter,
            startingSlide: 0,
            pager: '#nav',
            next: '.next_btn_slider',
            prev: '.prev_btn_slider'
        });
        function onAfter(curr,next,opts){
            jQuery('.indicator').removeClass('current')
            current_slide=opts.currSlide + 1
            jQuery('#thumb'+current_slide+' .indicator').addClass('current')
        }
        jQuery('#thumb1').click(function(){
            jQuery('#slider_accueil').cycle(0);
            return false;
        })
        jQuery('#thumb2').click(function(){
            jQuery('#slider_accueil').cycle(1); 
            return false;
        })
        jQuery('#thumb3').click(function(){
            jQuery('#slider_accueil').cycle(2); 
            return false;
        })
        jQuery('#thumb4').click(function(){
            jQuery('#slider_accueil').cycle(3); 
            return false;
        })
        jQuery('#thumb5').click(function(){
            jQuery('#slider_accueil').cycle(4); 
            return false;
        })
    })

<div id="sliderAccueil">
            <div id="nav" style="display:none;"></div>
            <img src="/wp-content/themes/customtheme/images/slider_previous.png" class="prev_btn_slider">
            <img src="/wp-content/themes/customtheme/images/slider_next.png" class="next_btn_slider">
            <div id="slider_accueil" style="position: relative;">
                                    <div style="position: absolute; top: 0px; left: 0px; z-index: 5; opacity: 0; display: none;">
                    <img src="/wp-content/uploads/2011/09/slider1.jpg">
                    <div>
                        <div class="maintext">
                            <h2>Slide 1</h2>
                            <p>Slide 1</p>
                        </div>
                        <div class="link">
                            <b href="/"></a>
                            <b class="call_slide" href="/"><ig src="/wp-content/themes/customtheme/images/call_slider.png"></a>
                        </div>
                    </div>
                </div>
                                    <div style="position: absolute; top: 0px; left: 0px; z-index: 4; display: none; opacity: 0;">
                    <ig src="/wp-content/uploads/2011/09/slider2.jpg">
                    <div>
                        <div class="maintext">
                            <h2>Slide 2</h2>
                            <p>Slide 2</p>
                        </div>
                        <div class="link">
                            <b href="/"></a>
                            <b class="call_slide" href="/"><img src="/wp-content/themes/customtheme/images/call_slider.png"></a>
                        </div>
                    </div>
                </div>
                                    <div style="position: absolute; top: 0px; left: 0px; z-index: 3; display: block; opacity: 0.942616;">
                    <img src="/wp-content/uploads/2011/09/slider3.jpg">
                    <div>
                        <div class="maintext">
                            <h2>Reprise des travaux majeurs</h2>
                            <p>Slide 3</p>
                        </div>
                        <div class="link">
                            <b href="/"></a>
                            <b class="call_slide" href="/"><img src="/wp-content/themes/customtheme/images/call_slider.png"></a>
                        </div>
                    </div>
                </div>
                                    <div style="position: absolute; top: 0px; left: 0px; z-index: 2; display: block; opacity: 0.0573843;">
                    <img src="/wp-content/uploads/2011/09/slider4.jpg">
                    <div>
                        <div class="maintext">
                            <h2>Slide 4</h2>
                            <p>Slide 4</p>
                        </div>
                        <div class="link">
                            <b href="/"></a>
                            <b class="call_slide" href="/"><img src="/wp-content/themes/customtheme/images/call_slider.png"></a>
                        </div>
                    </div>
                </div>
                                    <div style="position: absolute; top: 0px; left: 0px; z-index: 1; display: none; opacity: 0;">
                    <img src="/wp-content/uploads/2011/09/slider5.jpg">
                    <div>
                        <div class="maintext">
                            <h2>Slide 5</h2>
                            <p>Slide 5</p>
                        </div>
                        <div class="link">
                            <b href="/"></a>
                            <b class="call_slide" href="/"><img src="/wp-content/themes/customtheme/images/call_slider.png"></a>
                        </div>
                    </div>
                </div>
                                </div>
            <div id="thumbnails_slider_accueil">
                <ul>
                                                                    <li>
                        <b id="thumb1" href="#1">
                            <div class="indicator"></div>
                            <div style="background-image:url(/wp-content/uploads/2011/09/thumb1.png)" class="thumbnail">
                                <p>Voies retranchées trains ajoutés</p>
                            </div>
                            <div class="clear"></div>
                                                        </a>
                    </li>
                                            <li>
                        <b id="thumb2" href="#2">
                            <div class="indicator"></div>
                            <div style="background-image:url(/wp-content/uploads/2011/09/thumb2.jpg)" class="thumbnail">
                                <p>Événements</p>
                            </div>
                            <div class="clear"></div>
                                                        </a>
                    </li>
                                            <li>
                        <b id="thumb3" href="#3">
                            <div class="indicator current"></div>
                            <div style="background-image:url(/wp-content/uploads/2011/09/thumb3.jpg)" class="thumbnail">
                                <p></p>
                            </div>
                            <div class="clear"></div>
                                                        </a>
                    </li>
                                            <li>
                        <b id="thumb4" href="#4">
                            <div class="indicator"></div>
                            <div style="background-image:url(/wp-content/uploads/2011/09/thumb4.jpg)" class="thumbnail">
                                <p>Appels d'offres</p>
                            </div>
                            <div class="clear"></div>
                                                        </a>
                    </li>
                                            <li>
                        <b id="thumb5" href="#5">
                            <div class="indicator"></div>
                            <div style="background-image:url(/wp-content/uploads/2011/09/thumb5.jpg)" class="thumbnail">
                                <p>Environnement</p>
                            </div>
                            <div class="clear"></div>
                                                        </a>
                    </li>
                                        </ul>
            </div>
            <div class="clear"></div>
        </div>

^检查源代码，似乎没有比这更清晰的了

有人知道吗?

PS，所有的图片都是大的，所有的链接都是…Stackoverflow不让我发帖