Javascript Jquery将div滑出浏览器窗口的一侧 $（函数（）{ $（'#right_image1'）.hide（）.delay（'10000'）.fadeIn（'5000'）； $（'#left_image1'）.hide（）.delay（'10000'）.fadeIn（'5000'）； }); /*CSS*/ #left_image1{位置：固定；宽度：50%；高度：100%；左边距：0；背景：url（/images/1.jpg）} #右图1{位置：固定；宽度：50%；高度：100%；左边距：50%；背景：url（/images/2.jpg）}

当前在10秒延迟后分两个部分淡出。如何使右侧的div在显示5秒后滑出浏览器窗口的右侧，使左侧的div在显示5秒后滑出浏览器窗口的左侧

<script>
    $(function(){
      $('#right_image1').hide().delay('10000').fadeIn('5000');
      $('#left_image1').hide().delay('10000').fadeIn('5000');
    });
</script>

/* CSS */
#left_image1 { position: fixed; width: 50%; height: 100%; margin-left: 0; background: url(/images/1.jpg) } 
#right_image1 { position: fixed; width: 50%; height: 100%; margin-left: 50%; background: url(/images/2.jpg) }

一把小提琴正在工作。以下是更新后的JavaScript：

$('#right_image1').hide().delay('10000').fadeIn('5000', function() {

    $(this).animate({right: '-1px'}, 5000);
});

$('#left_image1').hide().delay('10000').fadeIn('5000', function() {

    $(this).animate({left: '-1px'}, 5000);
});

请注意，我们使用数字表示

延迟

和

fadeIn

的持续时间。然后，我们使用

animate

来处理左/右移动

此外，我们使用CSS而不是JavaScript隐藏；这是最好的做法

---

此外，我们在CSS中指定

left

值，以避免

上的边距或填充的交互。您可以显示一些与这些div相关的CSS吗？滑动将根据您使用的css而有所不同。

#left_image1{position:fixed；width:50%；height:100%；margin left:0；background:url（/images/1.jpg）}#right_image1{position:fixed；width:50%；height:100%；margin left:50%；background:url（/images/2.jpg）}

$(function() {
    $('#right_image1').delay(10000).fadeIn(500).delay(5000).animate({
        marginLeft: '100%'
    });
    $('#left_image1').delay(10000).fadeIn(500).delay(5000).animate({
        marginLeft: '-50%'
    });
});