2

继续点击此处的向下按钮:http: //thomasgrist.tumblr.com/直到到达终点。向下箭头应尽快消失。有什么想法可以通过以下代码实现吗?

我是一个菜鸟,但我认为我需要在我的 else 语句中纠正一个条件并说 if index = something do this 但我不知道索引应该是什么或如何写这个。

$('#next').click(function (event) {
  event.preventDefault();
  var $current = $('#listOfWork > .current');
  if ($current.index() != $('#listOfWork > div').length - 1) {
    $("#next").css("display", "inline");
    $("#prev").css("display", "inline");
    $current.removeClass('current').next().addClass('current');
    scrollTo($current.next());

  } else {
    $("#next").css("display", "none");
  }

});

$('#prev').click(function (event) {
  event.preventDefault();
  var $current = $('#listOfWork > .current');
  if (!$current.index() == 0) {
    $("#next").css("display", "inline");
    $("#prev").css("display", "inline");
    $current.removeClass('current').prev().addClass('current');
    scrollTo($current.prev());
  } else {
    $("#prev").css("display", "none");
  }
});
4

2 回答 2

1

我认为您需要将其添加到条件中:

if($current.next().is(':last'))
于 2013-01-08T23:06:25.150 回答
0

我想出了如何做到这一点。这是代码。如果下一个 div 索引值等于div的数量减 2,则不显示下一个按钮。为了在没有更多以前的 div 时隐藏上一个按钮,我们编写了当前索引等于 1 的条件。

(function() {
var scrollTo = function(element) {
$('html, body').animate({
scrollTop: element.offset().top - headerHeight + 40}, 500);}

$('#next').click(function(event) {
event.preventDefault();
var $current = $('#listOfWork > .current');
if  ($current.index() == $('#listOfWork > div').length - 2) {
//alert('Current index is ' + !$current.index() + '.');
$("#next").css("display", "none");
$("#prev").css("display", "inline");
$current.removeClass('current').next().addClass('current');
scrollTo($current.next());

} else if ($current.index() != $('#listOfWork > div').length - 1) {
//alert('Current index is ' + !$current.index() + '.');
$("#next").css("display", "inline");
$("#prev").css("display", "inline");
$current.removeClass('current').next().addClass('current');
scrollTo($current.next());
}    

});

$('#prev').click(function(event) {
event.preventDefault();
var $current = $('#listOfWork > .current');
if ($current.index() == 1) {
$("#prev").css("display", "none");
$("#next").css("display", "inline");
$current.removeClass('current').prev().addClass('current');
scrollTo($current.prev());

} else {
//alert('Current index is ' + !$current.index() + '.');
$("#next").css("display", "inline");
$("#prev").css("display", "inline");
$current.removeClass('current').prev().addClass('current');
scrollTo($current.prev());
}    
});
})
();
于 2013-01-12T23:06:17.100 回答