0

我想取消选择透明图像以选择其背后的元素，不使用propriety z-index，请帮帮我！这里是Jsfiddle 示例。

谢谢！

4

3 回答 3

3

你不能通过改变它的顺序来把输入放在前面吗？

HTML：

<input id="myinput" type="text" name="" value="SELECT ME PLEASE !"/>
<div id="menulogo"><img src="http://www.marcellokabora.com/web/wokomoko/img/menulogo.png"/></div>

CSS：

    #myinput{
    position: absolute;
    top: 130px;
    left: 260px;
    font-size: 20px;
}​
​

JSFiddle：http: //jsfiddle.net/bW52t/

否则，用于pointer-events使元素“点击”

HTML：

<div id="menulogo"><img src="http://www.marcellokabora.com/web/wokomoko/img/menulogo.png"/></div>
<input id="myinput" type="text" name="" value="SELECT ME PLEASE !"/>

​

CSS：

#menulogo,#menulogo  img{
    pointer-events: none;
}
#myinput{
    position: absolute;
    top: 130px;
    left: 260px;
    font-size: 20px;
}​

JSFiddle：http: //jsfiddle.net/2m4Tx/

于 2012-12-08T17:26:54.267 回答
1

好吧，如果您设置了 z-index，我认为没有办法访问由透明图像元素重叠的部分。当然，您可以编写一个简短的 JS 来更改图像的 z-index 值，或者很快将其隐藏等，但是如果不编辑此属性，我认为这是不可能的..

干杯!

于 2012-11-26T19:10:04.223 回答
1

这是一个棘手的问题。在尝试设置图像索引时，即使使用 z-index，旧 IE 浏览器也会出现问题。看起来，像 IE7 这样的浏览器会忽略图像的索引，即使它位于输入框的后面（例如）。您最好的选择是将图像设置为 CSS 中 div 的背景图像，并让两个元素都具有绝对位置。

<div style="position:absolute; background: url(images/myimage.jpg) no-repeat"></div>
<div style="position: absolute; left : 15px">
    <input type="text" />
</div>
于 2012-11-26T19:19:49.070 回答