简单滑块的背景图像jquery

Question

我正在尝试滑动背景图像与动画。这是我想要的第一张背景图。第二次将继续启动

这是我的代码

$('.next').live('click',function() {
            $('.ac_bgimage').animate({
                left:"-80em"    
            },1500, function(){
                test();
        });  
        });
        function test() {
        $('.ac_bgimage').attr('src','images/2.jpg');
        $('.ac_bgimage').css('left','0em');
    }

作为第一个图像工作正常，但它显示空白屏幕。在这个空白屏幕中，我想要第二个即将到来的屏幕

Thanks in advance

Answer 1

我不完全确定我是否理解正确，但这里有一些想法:

在动画完成后调用回调函数。根据你的代码，你应该看到第一个图像移动到左边，一旦它"消失"，第二个图像应该弹出到它原来的位置。由于一个图像标签一次只能容纳一个源，所以无论如何你都无法摆脱这个"空白"。

在这种情况下，通过em动画可能是一个糟糕的选择，我会尝试使用px值来代替。如果它是一个动态值，读取它使用例如.width()。

如果你只是想有一个简单的图像旋转，有一百万的jQuery插件可以做到这一点。我自己写了一个非常小的解决方案，也许代码可以给你一些指针:https://github.com/polarblau/simpleslider