bxslider上的z-index元素的順序

我需要使用無子元素排序bxslider的內容。圖像與頂部文字之間。bxslider上的z-index元素的順序

e.g

<div> 
<ul id="slider"> 
<li><img src="image1.jpg" /><span>text</span></li> 
</ul> 
<div class="under-text-over-image"></div> 
</div>

任何人都可以提出建議的z-index的？

我現有的CSS是類似於：

li img{ 
position:relative; 
z-index:1; 
} 
li span{ 
position:relative; 
z-index:3; 
} 
.under-text-over-image{ 
position:relative; 
z-index:2; 
}

感謝

來源

2013-04-30 James Dickinson

「我似乎嘗試了一切」所以，你有什麼嘗試？ – 2013-04-30 09:59:06

請參閱問題文字 – 2013-04-30 10:08:55

是/是父母的位置：位置：相對？ – 2013-04-30 10:11:53

我會嘗試沿着線的東西：

li img{ 
position:relative; 
z-index:-99999; 
} 

li span{ 
position:relative; 
z-index:99999; 
} 

.under-text-over-image{ 
position:relative; 
z-index:11111; 
}

東西沿着這些線路，使用時通常對我的作品z-index的。

希望這可以幫助你。

來源

2013-04-30 15:41:25

我最近的回覆... BXSlider在JS內部有zIndexing（詳情請閱讀：http://bxslider.com/docs/jquery.bxslider.html）。我發現解決任何幻燈片中閃爍的最佳方式，無論出現什麼方向，如果您將內容嵌入<ul>內部的另一個<div>。在我的實驗中，這似乎不會導致可見或不需要的不可見層重新排序。

這裏有一個幻燈片的例子：

<ul class="bxslider"> 
<li> 
    <div style="position:absolute;z-index:88888;"> 
     ... this content will be above everything else ... 
    </div> 
</li> 
    <li> 
    <div style="position:absolute;z-index:88888;"> 
     ... this content will be also be above ... 
    </div> 
</li> 
</ul>

注：Z-索引需要的位置聲明在所有的工作。

來源

2014-03-17 16:24:26 urbanaut

這是一個古老的問題，但這個問題確實出現了很多似乎。問題不在於Z-索引：

你最有可能丟失的影像文件

bx-wrapper .bx-prev { 
    left: 10px; 
    background: url(images/controls.png) no-repeat 0 -32px; 
}

快速檢查

.bx-wrapper .bx-controls-direction a { 
    background-color: blue; 
}

一旦你這樣做，你會看到控件在那裏。

來源

2015-07-22 14:22:13

bxslider上的z-index元素的順序

回答

相關問題