如果没有内容，请停止滚动

Question

如果div中没有​​剩余内容，我希望此脚本在单击时停止滚动。

$(document).ready(function () {
    $("#right").click(function () { 
        var leftPos = $('.DivDataMain').scrollLeft();
        $(".DivDataMain").animate({scrollLeft: leftPos + 250}, 800);
    });   

    $("#left").click(function () { 
        var leftPos2 = $('.DivDataMain').scrollLeft();
        $(".DivDataMain").animate({scrollLeft: leftPos2 - 250}, 800);
    });   
});  

这是演示链接：FIDDLE

在演示中，虽然div没有任何内容可以显示，但它仍然向右滚动。我希望它停止。

先谢谢。

Answer 1

您必须将white-space: nowrap添加到#midleBody元素，然后从中移除width: 90000px。

您的元素具有固定宽度，因此您的javascript会检测到它并一直持续到最后。您需要根据文本内部的文本动态调整元素，这就是white-space:nowrap所做的事情。