How do I add buttons to my Javascript/Jquery Slider?

Question

So I have a javascript/jquery image slider. Each slide is a

element, children of the div \"container\". Every five seconds, the last slide slides up and the new imag

相关标签:

Answer 1

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

Answer 2

Next:

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

Last:

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