0
我無法讓滑塊更改,而無需將其更改爲多個實例。我希望能夠點擊一個鏈接,以便在需要時從特定幻燈片加載滑塊。我已經嘗試了一切。感謝提前:)讓jquery滑塊導航工作
JS小提琴:http://jsfiddle.net/fVdzA/
function Slider(interval, slide)
{
//Clear Qeue
//Initialize Variables
var slides;
var titles;
var desc;
var amount;
var amounttitle;
var i;
//Count Elements
slides = $('#slider').children();
titles = $('#slider li').children('.title');
desc = $('#slider li').children('.desc');
amount = slides.length;
amounttitle = titles.length;
amountdesc = desc.length;
i=0;
//hide first slide properly
$(slides[0]).hide();
//Choose Function
if(slide==null){
//Automatic Start from 0
timer = setTimeout(automatic(0),4000);
}else{
//Choose Slide to start at
automatic(slide);
}
function automatic(i) {
$(slides[i]).hide();
$(titles[i]).hide();
$(desc[i]).hide();
$(slides[i]).fadeIn(1000, function(){
$(titles[i]).fadeIn(1000, function(){
$(desc[i]).fadeIn(1000, function(){
$(slides[i]).delay(2000).fadeOut(1000, function(){
$(titles[i]).hide();
$(desc[i]).hide();
i++; if (i >= amount){ i = 0;}
timer = setTimeout(automatic(i), 4000);
});
});
});
});
}
}
//Load navigation
slides = $('#slider').children();
$(slides).each(function(index) {
$("#slideControl").append(' <a href="#" class="button" ref="'+index+'">'+index+'</a> ');
});
$('.button').live("click", function() {
//clearTimeout(timer);
$('#slider li').hide();
Slider(4000, null).clearTimeout(timer);
});
Slider(4000, null).clearTimeout(timer);
<div id="slide">
<ul id="slider">
<li><img src="images/slide/slide1/slide.png" width="870" height="330" alt="slide1" class="round" /><span class="title"><img src="images/slide/slide1/title.png" alt="title" class="leftMidTitle" /></span><span class="desc"><img src="images/slide/slide1/desc.png" alt="desc" class="leftMidDesc" /></span></li>
<li><img src="images/slide/sample2.png" width="870" height="330" alt="sample" class="round" /><span class="title">karl text</span><span class="desc">Crazy Text</span></li>
<li><img src="images/slide/sample3.png" width="870" height="330" alt="sample" class="round" /><span class="title">vgblv dfvd</span><span class="desc">Crazy Text</span></li>
</ul>
<div id="slideControl"></div>
</div>
</div>
你能連接一個小提琴嗎?將會有所幫助。 – 2012-07-13 05:11:34
已經做了謝謝http://jsfiddle.net/fVdzA/ – Anytech 2012-07-13 05:26:47