Javascript 下拉隐藏在Mooder后面

我在

mootools

滑块中有一个自定义下拉框，如下图所示。此滑块包含三个div，它们会一个接一个地垂直旋转。滑块和自定义下拉列表的javascript和css如下所述。我的问题是，当我将下拉列表放入slider div时，它隐藏在slider div后面，如下图所示。根据要求，我不能改变下拉位置，也不能增加滑块高度，那个么如何在顶部关闭滑块上显示下拉列表项。如有任何建议，将不胜感激

现在你们可以看到上面的“每单位成本”下拉列表隐藏在滑块容器后面

滑块

mootools

下降

---

提前谢谢

可以将滑块放在iframe中吗？也许有一种更复杂的治疗方法，但它总是有效的

可以将滑块放在iframe中吗？也许有一种更复杂的治疗方法，但它总是有效的

如果某些内容无法在HTML中显示，通常是由于在其父项上设置了溢出：隐藏css属性

似乎这就是您的问题所在-尝试删除包含下拉元素的父元素的隐藏溢出

---

如果您需要overflow:hidden，那么还有其他方法可以创建这种效果，因此如果您使用或其他方式发布完整代码，它确实会有所帮助。

如果某些内容无法在HTML中显示，则通常是由于它的父项上设置了overflow:hidden css属性

似乎这就是您的问题所在-尝试删除包含下拉元素的父元素的隐藏溢出

---

如果您需要overflow:hidden，那么还有其他方法可以创建这种效果，因此如果您使用或其他方式发布完整代码，它将非常有帮助。

我还获得了z-index:100px。。。但它不起作用。@user1273915您是否尝试过将滑块z索引设置为负值？我还得到了z索引：100px。。。但它不起作用。@user1273915您是否尝试将滑块z-index设置为负数？您是否可以提供任何与iframe滑块相关的演示，或者您是否可以解释如何将iframe准确地用作滑块。只需将滑块放置在单独的页面上，然后将该页面加载到您希望显示的页面上的iframe中即可。看。嗨，我已经创建了另一个演示，但我失败了。如下网址。请帮忙！自我形象只是一回事。你还需要把基本的东西放在一个单独的页面上，这样我们就可以摆弄它了。你能提供任何与iframe滑块相关的演示，或者你能解释一下如何准确地使用iframe作为滑块。只需将滑块放在一个单独的页面上，然后将该页面加载到你想要显示的页面上的iframe中。看。嗨，我已经创建了另一个演示，但我失败了。如下网址。请帮忙！自我形象只是一回事。你还需要把基本的事情整理一下，这样我们就可以处理它了。

<script type="text/javascript">
var _lofmain = $('lofslidecontent45');
var _lofscmain = _lofmain.getElement('.lof-main-wapper');
var _lofnavigator = _lofmain.getElement('.lof-navigator-outer .lof-navigator');
var object = new LofFlashContent(_lofscmain,
                                  _lofnavigator,
                                  _lofmain.getElement('.lof-navigator-outer'),
                                   { fxObject: { transition: Fx.Transitions.Quad.easeInOut, duration: 800 },
                                       interval: 3000,
                                       direction: 'vrdown'
                                   });
object.start(true, _lofmain.getElement('.preload'));

var isCustom = "@(ViewBag.IsCustom)";
if (isCustom == "True") {
    object.callMyEvent(2, true); // call my custom event 
    object.setNavActive(2);
}

/* CSS Document */
.lof-slidecontent
{
    margin-left: 0px;
    position: relative;
    overflow: hidden;
    width: 1200px;
    height: 486px;
}
.lof-slidecontent .preload
{
    height: 100%;
    width: 100%;
    background: #FFF;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 10;
    color: #FFF;
    text-align: center;
}
.lof-slidecontent .preload div
{
    height: 100%;
    width: 100%; /*background: transparent url(../Images/MyImages/Icons/load-indicator.gif) no-repeat scroll 50% 50%;*/
}
/* main flash */
.lof-main-wapper
{
    margin-right: auto;
    overflow: hidden; /*background: transparent url(../Images/MyImages/Icons/load-indicator.gif) no-repeat scroll 50% 50%;*/
    padding: 0px;
    height: 488px;
    width: 1014px;
    position: relative;
    overflow: hidden;
}

.lof-main-wapper .lof-main-item
{
    padding: 0px;
    margin: 0px;
    height: 488px;
    width: 100%;
    position: absolute;
}
.lof-main-wapper .lof-main-item img
{
    padding: 0px;
    width: 100%;
}

.lof-main-item-desc
{
    z-index: 100px;
    position: absolute;
    top: 150px;
    left: 50px;
    width: 400px;
    background: url(../images/transparent_bg.png); /* filter:0.7(opacity:60) */
}
.lof-main-item-desc p
{
    color: #FFF;
    margin: 0 8px;
    padding: 8px 0;
}
.lof-main-item-desc h3 a
{
    color: #FFF;
    margin: 0;
    font-size: 140%;
    padding: 20px 8px 2px;
    font-family: "Trebuchet MS" ,Trebuchet,Arial,Verdana,sans-serif;
}



/* item navigator */
ul.lof-navigator
{
    top: 0px;
    padding: 0px;
    margin: 0px;
    position: absolute;
    width: 100%;
    overflow: hidden;
}
ul.lof-navigator li
{
    cursor: hand;
    cursor: pointer;
    list-style: none;
    width: 100%;
    padding: 0px;
    margin: 0px;
}
.lof-navigator-outer
{
    position: absolute;
    right: 0;
    top: 0px;
    z-index: 100;
    height: 488px;
    width: 204px;
    padding: 0px;
    margin: 0px;
    float: left;
}
.lof-navigator li.active
{
    background: url(../../Images/MyImages/Icons/arrow-bg2.png) no-repeat;
    background-color: #d21c1c;
    color: #FFF;
}
.lof-navigator li:hover
{
}



.lof-navigator li div
{
    text-align: center;
    height: 162px;
    position: relative;
    margin-left: 0px;
    padding-left: 0px;
    background-color: #FFFFFF;
}

.lof-navigator li.active div
{
}


.lof-next
{
    position: absolute;
    top: 0;
    height: 30px;
    background: #F9F9F9;
    display: block;
    width: 100%;
}
.lof-previous
{
    position: absolute;
    bottom: 0;
    height: 30px;
    background: #F9F9F9;
    display: block;
    width: 100%;
}
.lof-navigator-MycontentHeader
{
    font-family: Caecilia LT Std;
    font-size: 26px;
    color: #d21c1c;
}
li.active .lof-navigator-MycontentHeader
{
    color: #FFF;
}
.lof-navigator-MycontentFooter
{
    font-family: TradeGothic, Arial;
    font-style: oblique;
    font-size: 13px;
    color: Black;
}

li.active .lof-navigator-MycontentFooter
{
    color: #FFF;
}