easy slider jquery for background image

i am trying to slide background image with animate. as i want if my first background image. second will continues start

here is my code

$('.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');
    }

as first image is working fine but it display blank screen . in this blank screen i want second upcoming screen

Thanks in advance

---

I'm not fully sure if I understand you correctly, but here are a few thoughts:

The callback is called after the animation has finished. According to your code you should see the first image move to the left and once it’s "gone" the second image should pop into it’s original place. Since an image tag can only hold one source at a time, you won't be able to get rid of this "gap" anyhow they way you're doing it.

Also animating by em might be a bad choice in this case, I'd try a px value instead. If it's a dynamic value, read it out using e.g. .width().

If you just want to have a simple image rotation, there's a million plugins for jQuery out there which do just that. I've written a really tiny solution a while ago myself, maybe the code can give you some pointers: https://github.com/polarblau/simpleslider