Don*_*Don 10 javascript css canvas z-index internet-explorer-9
我遇到一个奇怪的问题,z的索引为a <canvas>; 不能在IE9中渲染为正确的图层.请看看这个jsfiddle:
http://jsfiddle.net/xacto/MTUHX/
这是它应该如何工作:
<canvas>应该是下一层.这适用于Chrome,Firefox甚至IE8.但是,在IE9中,青色<canvas>是顶层,红色轮廓的超链接框不再可点击,除了底部的小区域,它不覆盖青色<canvas>.
这是另一件值得注意的事情:如果你改变了<canvas>a <div>即改变了这条线:
var can = $('<canvas></canvas>').css({...
Run Code Online (Sandbox Code Playgroud)
至
var can = $('<div></div>').css({...
Run Code Online (Sandbox Code Playgroud)
它也适用于IE9.这让我相信这是一个<canvas>相关的问题,而不仅仅是一个z指数问题.
我根据网络上的建议尝试了很多z索引组合,但似乎没有任何效果.如果有人对此有答案,我们将不胜感激.
PS有些人可能会问为什么<canvas>要通过JavaScript添加它以及为什么它被添加为第一个元素<body>.没有详细说明,使用<canvas>它的第三方应用程序要求以这种方式添加它.
tw1*_*w16 20
不要问我为什么,但由于某种原因,问题似乎是因为您的盒子上没有背景设置.
如果您background-color为其中一个设置了一个,#box2或者#box3该链接变为可点击.实例:http://jsfiddle.net/tw16/HFKMC/
所以你可以使用:
.box2{
z-index: 10;
position: relative;
min-width: 200px;
min-height: 200px;
background-color: rgba(255,255,255,0.01); /* this is basically transparent */
}
Run Code Online (Sandbox Code Playgroud)
通过使用rgba并设置一个非常低的alpha值,你甚至不会注意到它已被应用.
| 归档时间: |
|
| 查看次数: |
8041 次 |
| 最近记录: |