Javascript 调整窗口大小时Div跳出空间

修正！（答复如下）

我有这个动画横幅，我包括在所有的网页。不幸的是，当浏览器窗口调整大小时，它跳出了他的空间

您可以在这里查看：

代码如下：

<style> 

#banner{
    position: relative;
    margin-left:-1000px;
    height:195px;
    width:1000px;
    z-index:1;
}   

#banner img{position:absolute;z-index:1}
#banner img.active{z-index:4}

#横幅{
位置：相对位置；
左边距：-1000px；
高度：195px；
宽度：1000px；
z指数：1；
}   
#横幅img{位置：绝对；z索引：1}
#banner img.active{z-index:4}

函数cycleImages（）{
var$active=$（'#banner.active'）；
var$next=（$active.next（）.length>0）？$active.next（）：$（“#banner img:first”）；
$next.css（'z-index'，2）；//将下一个图像向上移动
$active.fadeOut（1500，函数（）{//淡出顶部图像
$active.css（'z-index'，1）.show（）.removeClass（'active'）；//重置z-index并取消隐藏图像
$next.css（'z-index'，3）.addClass（'active'）；//使下一个图像成为顶部图像
});
}
$（文档）.ready（函数（）{
//每2秒运行一次
setInterval（'cycleImages（）'，2000）；
})

---

因此，我将边距更改为边距：0自动。下一个错误是，我把include代码行包装成了一个，这把一切都搞砸了，所以我干脆把它删除了

---

Noob问题

看起来你正试图建立一个响应迅速的网站。。。 作为滑块尝试以下操作：

---

它使用方便，反应灵敏。

嘿，谢谢。我开始用另一个滑块（液体滑块）来构建这个东西，但随着我工作的深入，它变得越来越复杂。所以我决定自己建造一个。第一次使用jQuery，但它没有那么糟糕，是吗？不是！您正在缓存查询，这是一个很好的做法。一些更高级的程序员没有这样做。。。干得好！继续使用你的滑块，以最好的方式学习！

<script>
    function cycleImages() {
    var $active = $('#banner .active');
    var $next = ($active.next().length > 0) ? $active.next() : $('#banner img:first');
    $next.css('z-index', 2); //move the next image up the pile
    $active.fadeOut(1500, function () { //fade out the top image
        $active.css('z-index', 1).show().removeClass('active'); //reset the z-index and unhide the image
        $next.css('z-index', 3).addClass('active'); //make the next image the top one
    });
}
    $(document).ready(function () {
     // run every 2s
     setInterval('cycleImages()', 2000);
 })
</script>


<div id="banner">
<img src="img/logo.png" style="float:left"  />
<img class="active" src="img/banner.png" alt="Banner image" />
<img src="img/banner2.png" alt="Banner image" />    
<img src="img/banner3.png" alt="Banner image" />    
<img src="img/banner4.png" alt="Banner image" />
</div>