我做了一個基本的滑塊使用jQuery,只有margin-left,我不能使用插件。 也無法訪問HTML,下一個和上一個按鈕適用於滑塊轉換。但是現在我需要爲每個滑塊操作鏈接,當您單擊每個滑塊的鏈接時必須轉換到其特定的滑塊。但我不知道如何做到這一點。點擊鏈接到相關的滑塊項目
HTML
<div class="container">
<button class="previous">previous</button>
<div class="item item1">slider 1</div>
<div class="item item2">slider 2</div>
<div class="item item3">slider 3</div>
<div class="item item4">slider 4</div>
<button class="next">next</button>
<ul>
<li><a href="slider1">slider1</a></li>
<li><a href="slider2">slider2</a></li>
<li><a href="slider3">slider3</a></li>
<li><a href="slider4">slider4</a></li>
</ul>
</div>
jQuery的
var currentSlider = 0;
$('.next').click(function(e) {
if (currentSlider != 1) {
$('.item').each(function(index, value) {
var currLeft = parseInt($(value).css('margin-left'));
var newLeft = currLeft - ($(window).innerWidth());
$(value).css('margin-left', newLeft + 'px');
});
currentSlider += 1;
};
});
$('.previous').click(function(e) {
e.preventDefault();
if (currentSlider != -2) {
$('.item').each(function(index, value) {
var currLeft = parseInt($(value).css('margin-left'));
var newLeft = currLeft + ($(window).innerWidth());
$(value).css('margin-left', newLeft + 'px');
});
currentSlider -= 1;
};
});
?這不起作用。爲什麼隱藏? – 2014-09-29 23:47:17
你想一次僅顯示一張幻燈片嗎? – Aqib1604 2014-09-30 18:37:24
我會完成轉換以到達被點擊的特定滑塊。看到鏈接jsfiddle。謝謝 – 2014-09-30 18:43:20