Question

在你进一步阅读之前，我正在使用OneByOne Jquery Slider插件，插件内容是我试图捕捉到它的容器div的顶部。要了解有关OneByOne的更多信息，请访问以下链接：http://codecanyon.net/item/jquery-onebyone-slider-plugin/684613

我试图将内部div捕捉到其容器div的顶部，这是我的（我认为无论如何），相关的CSS：

#banner{   
    position: absolute; 
}     

.oneByOne1{
    margin-right: auto;
    margin-left: auto;
    width: 960px;
    height: 420px;    
    position: relative;
    overflow: hidden;
}   

#banner .oneByOne_item{
    position: absolute;
    width: 960px;
    height: 420px;  
    overflow: hidden;  
    display: none;
}

我试图捕捉到顶部的div是“banner”div，而容器div是“content”，但是使用OneByOne插件，它被识别为上面编码的oneByOne div块，这里是我的相关HTML ：

<div id="content">
    <div id="banner">
        <div class="oneByOne_item">
            <img src="img/storefront.jpg" class="item_1_1" />               
        </div>
        <div class="oneByOne_item">                                     
            <img src="img/livemusic.jpg" class="item_1_2" />
        </div>
        <div class="oneByOne_item">                                     
            <img src="img/brokerecord.jpg" class="item_1_3" />
        </div>
    </div>
</div>

以下是我当前网站的链接：http://raider.grcc.edu/~ryanduffing/recordstore/

Answer 1

<div class="search_line">有position:relative和top: -100px。里面的图像高度为61px，所以它周围的div也是如此。

因为它相对定位，所以它仍占用DOM中自然会出现的空间，但是你的top值会将其“拉”到视觉上出现的位置。因为它仍占用DOM中的空间，它会将你的#content推向61px。

我看不出有充分理由离开它你是如何做到的，所以如果你可以改变它而不打破其他任何东西，我建议你把它改成

.main_header .search_line {
    position: absolute;
    top: 39px;
    right: 0;
}

内部div不会捕捉到容器div的顶部

1 个答案: