Question

修正了！（以下回答）

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

您可以在此处查看：http://www.paparashie.nl/woonkans/

以下是代码：

<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}

<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>

所以，我将保证金更改为保证金：0自动。接下来的错误是我将包含的代码行包裹在a中，这搞砸了所有内容，所以我只是删除了它。

Noob问题......

Answer 1

看起来您正在尝试构建响应式网站... 试试这个滑块：

http://www.woothemes.com/flexslider/

易于使用且响应迅速。

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

1 个答案: