Question

我正在开发一个摄影作品集主题，我在为网站上的一个功能编写jQuery时遇到了一些障碍。我想要完成的是让每次单击上一个和下一个图标时，缩略图的内联列表向左或向右移动110px（单个缩略图的宽度）。

$('.next').each(
    function(){
        $(this).bind (
            "click",
            function(event){
                $('#thumbnailGallery ul').animate(
                    {left:-110}, {
                        duration:'fast',
                        easing:'easeInSine'
                });
            }
        );
    }
);

$('.prev').each(
    function(){
        $(this).bind (
            "click",
            function(event){
                $('#thumbnailGallery ul').animate(
                    {left:110}, {
                        duration:'fast',
                        easing:'easeInSine'
                });
            }
        );
    }
);

我目前正在使用.each（）;使用onClick绑定动画的功能，但动画只出现一次。例如，如果我点击.next它将动画-110px，但是当我再次点击它时它不会。 .prev。

也是如此

Answer 1

请改为尝试：

$('.next').each(
    function(){
        $(this).bind (
            "click",
            function(event){
                $('#thumbnailGallery ul').animate(
                    {left:"-=110px"}, {
                        duration:'fast',
                        easing:'easeInSine'
                });
            }
        );
    }
);

$('.prev').each(
    function(){
        $(this).bind (
            "click",
            function(event){
                $('#thumbnailGallery ul').animate(
                    {left:"+=110px"}, {
                        duration:'fast',
                        easing:'easeInSine'
                });
            }
        );
    }
);

应该按照例子工作

每次点击动画背景位置

1 个答案: