Question

这是divslider示例的链接：http://jsfiddle.net/jtbowden/ykbgT/light/

但是在这个例子中，div正在从右向左移动

但是我想现在从左到右移动div ..这个网站里面已经有一个编辑器。所以请帮我把反向移动div。因为在我的代码上我想要双方

$('.box').click(function() {
    $('.box').each(function() {
        if ($(this).offset().left < 0) {
            $(this).css("left", "150%");
        } else if ($(this).offset().left > $('#container').width()) {
            $(this).animate({
                left: '50%',
            }, 500 );
        } else {
            $(this).animate({
                left: '-150%',
            }, 500 );
        }
    });
});

Answer 1

以下是您在JS小提琴上的作用：

$('.box').click(function() {
    $('.box').each(function() {
        if ($(this).offset().left < 0) {
           $(this).animate({
                left: '50%',
            }, 500 );
        } else if ($(this).offset().left > $('#container').width()) {
            $(this).css({
                'left': '-150%',
            } );
        } else {
            $(this).animate({
                left: '150%',
            }, 500 );
        }
    });
});

Answer 2

这是你的意思吗？

#box1 {
    background-color: green;
    left: 150%; /* changed this */
}
#box3 {
    background-color: red;
    left: -150%; /* changed this */
}

和

$('.box').click(function() {
    $('.box').each(function() {
        if ($(this).offset().left > $('#container').width()) {
            $(this).css("left", "-150%");
        } else if ($(this).offset().left < 0) {
            $(this).animate({left:'50%'},500);
        } else {
            $(this).animate({left:'150%'},500);
        }
    });
});

Div滑块反向

2 个答案: