Question

我试着在这里用jquery创建一个滑动横幅。

我试图以这种方式编码

    .post(this,{ajax : 1}, function(data){
    var oldImage = $('div.banner > img');
    var newImage = $(data).insertAfter(oldImage).css('position','absolute').css('left',800);
    newImage.load(function(){ 
oldImage.animate({left:-800},'medium',function(){});    newImage.animate({left:0},'medium',function(){
oldImage.remove();
    });
});
});
return false;

但是，2张图像之间的过渡并不顺畅，而且似乎有当旧图像滑落时，2图像与新图像之间有一点间隙滑入。我假设是因为图像执行之间存在滞后。你们有什么技巧可以让我更好地做到这一点吗？

Answer 1

你所拥有的应该是正常的。感知延迟可能是实际上不是800px宽的图像。因为你为新/旧图像设置了800px和800px的动画效果，如果它们实际上不是那么宽，那么就会有一个空白。

您可以使用slide effect进行此操作，也可以将left金额调整为图片的正确尺寸，例如通过.width()。

对于间隙“滞后”和宽度you can see what I mean here。有一个很大的差距，但只是因为800px的left属性大于示例中的275px图像。

图像幻灯片库与jquery

1 个答案: