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元素的顺序

回答

相关问题