Question

奇怪的一个：在我的网站上，位置有效，但是鼠标悬停和z索引却没有。鼠标悬停工作，但位置不起作用。

是否有一些我缺少的CSS设置导致jQuery无法选择？

我希望这只是糟糕的代码或一些我不知道的细微差别。

非常感谢提前！

HTML

<div style="text-align: center; position: relative">
    <span id="selectSupplierNameSpan" style="z-index:100">
        Vendor
    </span>
    <div id="selectSupplierNameContainer" style="position: absolute; opacity: 0; z-index:50">
        <input type="text" id="selectSupplierName" ></input>
    </div>
</div>

的jQuery

$("#selectSupplierNameContainer").position({
    my: "center",
    at: "center",
    of: $("#selectSupplierNameSpan"),
});

$("#selectSupplierNameSpan").mouseover(function() {
    var thisHeight = $("#selectSupplierNameContainer").height();
    $("#selectSupplierNameContainer").animate({
        opacity: 1,
        top: "+=" + thisHeight
    }, 500);
});

http://jsfiddle.net/7s4VN/10/

修改

去了jquery 1.7.2，并添加了ui 1.18，现在鼠标悬停不起作用。

Answer 1

z-index只能应用于定位元素。将position:relative;添加到<span>的样式中，效果很好。

http://jsfiddle.net/mblase75/7s4VN/11/

定位元素未正确放置＆amp; z-index不起作用

1 个答案: