我有一个带有气泡窗口的滑块。一旦我滑动滑块,气泡窗口将跟随滑块处理程序的位置。问题是滑块上方有一个用于显示标题的 div。因此,当滑动发生时,气泡窗口与滑块上方的 div 重叠,其中 1/3 部分隐藏在 div 下方。一旦发生滑动,我总是使用z-index:100
气泡窗口使其位于前面。但是,气泡窗口仍在 div 下方。请参阅图片以获取信息。任何想法?
气泡窗容器
.sliderAreaWithUnits { padding-left: 80px !important; padding-right:50px !important; padding-top: 30px !important; padding-bottom: 30px !important; position: relative;top: 0;left: 40;border-radius: 4px;}
气泡窗口 css
.bubbleWindow {
position: absolute;
top: -20px;
width: 80px;
height: 50px;
font-size: 10px;
font-weight: bold;
text-align: center;
vertical-align: middle;
padding-top: 9px;
background: transparent url('../Images/bubbleWithUnits.png') no-repeat ;
display: none;
z-index: 100;
}
标题 css
#headerTitle, .headerTitle {
margin:0;
color:@primary-text-color;
padding:3;
font:bold 16px Arial, Sans-Serif;
text-decoration:none;
}
.trigger #headerTitle {
background:url('../../content/images/toggleArrowUp.png') no-repeat right;
margin:0;
height: 24px;
padding:0 0 0 10px;
font:bold 12px/24px Arial, Sans-Serif;
color:@primary-text-color;
text-decoration:none;
}