0
我试图与jQuery的周期中，当你点击5的一个缩略图，您切换到滑块向右滑动滑块导航。这些拇指在滑块外部。jQuery的周期：无法通过幻灯片
事情是，由于某种原因，该startingSlide参数不工作，只是在做.cycle（数）不要么，即使滑块明确运行。下面是在代码偷看：
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;
})
})
HTML
<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，这是故意的，所有的IMG是IG，各个环节都...＃1不会让我交的。
把所有的ig都改为img，因为“是的，你可以（至少我可以）” –