Question

当div的样式'left'达到'0'或'0px'时，如何阻止div向左滚动？现在我正在使用animate自定义效果向左和向右滚动div以显示隐藏的溢出但是当div在样式上达到'0'或'0px'时：我希望阻止用户进一步向左滚动没有内容，只是空的空间。我目前有以下代码似乎没有按照我想要的方式工作：

$(document).ready(function(){
if ($("#ajax-matched-results").css('left') == '0' || '0px') {
    $("#scrollLeft-results").click(function() {
    $(".matched-results-items").animate({"left": "0px"}, "slow");
    });
    $("#scrollRight-results").click(function() {
    $(".matched-results-items").animate({"left": "-=547px"}, "slow");
    });
} else {
    $("#scrollLeft-results").click(function() {
    $(".matched-results-items").animate({"left": "+=547px"}, "slow");
    });
    $("#scrollRight-results").click(function() {
    $(".matched-results-items").animate({"left": "-=547px"}, "slow");
    });
    }
});

感谢您的帮助！

Answer 1

首先，if语句是不是应该在click事件中？我根本没看到它会如何执行，或者最多只执行一次。

另外，您的第一个if语句将始终为true。你想要的是

if ($("#ajax-matched-results").css('left') == '0' || $("#ajax-matched-results").css('left') == '0px')

另外，我并非100％确定“ - = 547px”等也会按预期工作。是否要在每次单击时按该值递增它们，或者是否要将它们设置为该值。我假设你每次都想增加它。

这或多或少是你应该拥有的：

$(function(){
    // this actually eliminates the need for the above if statement
    // assuming you only have one thing you're going to animate
    var position = 0;

    // move object right 547px regardless of current position
    $('#scrollRight-results').click(function(){
        // animate regardless?
        // unless you're setting right side bounds as well
        position += 547;
        $('id').animate({'left': position}, 'slow');
    });

    // move object left 547px if not already at 0
    $('#scrollLeft-results').click(function(){
        if (position != 0){
            position -= 547;
            $('id').animate({'left': position}, 'slow');
        }
    });
})

Answer 2

我几乎可以保证，如果你不断点击按钮，这个代码会中断，因为你没有检查动画，所以它会一直持续下去。所以你应该做点什么：

if($("selector").is(":animated")){
 return false;
}

Jquery：当样式：left == 0或0px时，如何防止向左进一步动画？

2 个答案: