javascript - 如果 margin-left = 0px，我如何更改我的 margin-left-increase 函数以禁用？

Question

这是我到目前为止的代码。该代码实际上工作正常，所以希望这是一个小调整，有人可以帮助我吗？

所以我在 UL 上的宽度是 2000px，隐藏了溢出。供用户滚动缩略图列表以选择显示在上面的 div 中。

出于好奇，我还是希望看到它完成

HTML:

<img class="thumbSliderLeft" src="Images/left.png" />
<div class="thumbContainer">


<ul class="galleryThumbs">
<li class="gallery"><img class="thumb" src="Images/thumbs/sam.jpg" /></li>

<li class="gallery"><img class="thumb" src="Images/thumbs/cat.jpg" /></li>

<li class="gallery"><img class="thumb" src="Images/thumbs/horse.jpg" /></li>

<li class="gallery"><img class="thumb" src="Images/thumbs/mags.jpg" /></li>

<li class="gallery"><img class="thumb" src="Images/thumbs/tree.jpg" /></li>

<li class="gallery"><img class="thumb" src="Images/thumbs/soup.jpg" /></li>

</ul>



</div>

CSS

div.thumbContainer {
            width: 800px;
            height: 270px;
            position: relative;
            top: -50px;
            overflow: hidden;
            margin: 0 auto;
}

ul.galleryThumbs {
    width: 2000px;
}

ul.galleryThumbs li.gallery {
    margin-right: 10px;
    padding-top: 3px;
    display: inline-block;
    float: left;
    width: 200px;
    border-style: solid;
    border-radius: 10px;
    border-width: 5px;}

Javascript/Jquery

$(function () {

    var marginLeft = $("ul.galleryThumbs").css("margin-left");

    var indentLeft = $("img.thumbSliderLeft").click(function () {
        $("ul.galleryThumbs").animate({
            "margin-left": "+=250px"
        }, 500, 'linear');

        if (marginLeft === 0) {
            indentLeft.off()
        };

    });
});

Answer 1

如果正确解释问题，请尝试使用 .off(event) ；请注意，.animate() 会将 margin-left 设置为以 "px" 结尾的 String，而不是 数字 0 。

不清楚问题 0 期望在 marginLeft === 0 处代表什么？

$(function () {

        var marginLeft = $("ul.galleryThumbs").css("margin-left");

        $("img.thumbSliderLeft").on("click", function () {
            $("ul.galleryThumbs").animate({
                "margin-left": "+=250px"
            }, 500, 'linear');

            if (marginLeft === 0) { 
                $(this).off("click")
            };

        });
    });