使用jquery覆盖div不可点击

我有一个问题，我在页面上的菜单上有一个半透明的div，我想让该div点击。使用jquery覆盖div不可点击

CSS属性指针事件不是一个选项，因为我需要生成有效的CSS。我尝试过：

event.preventDefault(); 
event.stopPropagation();

没有运气，“底层”上的div不会被点击。

这里是我的一个简化版本代码：

<div id="menuContainer"> 
<div id="menu"> 
//here comes all the items of my menu 
</div> 
</div> 
<div id="shadow"> 
</div>

的CSS：

#menuContainer { 
position: absolute; 
top: 0px; 
z-index: 0; 
height: 200px; 
} 
#menu { 
width: 300px; 
height: 30px; 
margin: 0 auto; 
position: absolute; 
z-index: 10; 
top: 160px; 
} 
#shadow { 
position: absolute; 
z-index: 1; 
top: 150px 
height: 200px; 
}

是不是一种选择，为我改变的z索引或布局，只是我需要的时候我点击阴影，点击“重新传输”到菜单中。

来源

2011-12-07 IAmJulianAcosta

据我所知，这是不可能的，在不支持的浏览器中不能替代指针事件。你将不得不改变你的网站布局，z-index不会帮你点击一个元素。只有我能想到的是抓住鼠标指针位置并触发覆盖元素后面的相应元素，但对于基本上是设计缺陷的东西而言，这太过复杂。 – adeneo

你看过使用jQuery的click（）函数吗？

http://api.jquery.com/click/

你可以捕捉到最顶端的元素上的click事件，模拟下面的元素上点击，然后返回向停止原来的点击。

来源

2011-12-07 02:30:16 kwerty

你可以做这样的事情

$('#shadow').click(function() { 
    $('#menu').trigger('click'); 
});

阴影元素通过单击事件上的菜单。

如果您还需要中继鼠标位置，请查看Mouse Position教程。

来源

2011-12-07 02:34:10 declan

但如果我触发点击菜单，它会自动触发事件到内部元素？我有：

– IAmJulianAcosta

不！只有#menu元素会被触发，除非你想方设法找出你的阴影元素后面的菜单部分，然后触发该特定元素。 – adeneo

是的，我同意@adeneo这整个方法可能是一个设计缺陷。你为什么需要在菜单上放一些东西？你可以设置菜单项的背景图像，或者类似的东西吗？ – declan

使用jquery覆盖div不可点击

回答

相关问题