1

だから私はjavascript/jqueryの画像スライダーを持っています。各スライドは、div「コンテナ」の子である <div> 要素です。5 秒ごとに最後のスライドがスライドアップし、新しい画像がフェードインします。単純なことです。これが私のコードです：

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);

では、次のスライドと最後のスライドに移動するボタンを追加するには、どうすればよいでしょうか?

4

2 に答える 2

0

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-27T20:54:29.337 に答える
0

次：

$("#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-27T20:51:00.863 に答える