如何將按鈕添加到我的Javascript/JQuery滑塊？

所以我有一個JavaScript/jQuery圖像滑塊。每張幻燈片是一個<div>元素，div「容器」的子元素。每五秒鐘，最後一張幻燈片上滑，新圖像淡入。簡單的東西。這是我的代碼：如何將按鈕添加到我的Javascript/JQuery滑塊？

window.onload = function start() { 
    slide(); 
} 

function slide() { 
    var num = 0; 
    window.setInterval(function() { 
     $("#container div:eq(" + num + ")").slideUp(450); 
     num = (num + 1) % 4; 
     $("#container div:eq(" + num + ")").fadeIn(450); 

    }, 5000);

那麼，我需要做什麼來添加按鈕，帶你到下一張幻燈片和最後一張幻燈片？

來源

2012-07-27 user1489314

我很困惑;通常當人們說「jQuery滑塊」時，他們指的是一個jQuery UI滑塊小部件（http://jqueryui.com/demos/slider/）。儘管你的代碼看起來並不像它使用那個小部件。如果你能更好地解釋你正在嘗試做什麼以及你的意思是「滑塊」，那將會很有幫助。 – machineghost 2012-07-27 20:46:59

$("#next").click(function() { 
    $("#container div:eq(" + num + ")").slideUp(450); 
    num = (num + 1) % 4; 
    $("#container div:eq(" + num + ")").fadeIn(450); 
});

末：

$("#last").click(function() { 
    $("#container div:eq(" + num + ")").slideUp(450); 
    num = 4; 
    $("#container div:eq(" + num + ")").fadeIn(450); 
});

來源

2012-07-27 20:51:00 androbin

HTML：

<a id="next" href="#">next</a> 
<a id="last" href="#">last</a>

的JavaScript：

$(document).ready(function() { 
    var cur = 0; 

    var slide = function (n) { 
    $("#container div:eq(" + cur + ")").slideUp(450); 
    cur = n; 
    $("#container div:eq(" + cur + ")").fadeIn(450); 
) 

    setInterval(function() { slide((cur + 1) % 4); }, 5000); 

    $('#next').click(function() { slide((cur + 1) % 4); }); 
    $('#last').click(function() { slide(3); }); 
});

來源

2012-07-27 20:54:29

如何將按鈕添加到我的Javascript/JQuery滑塊？

回答

相關問題