Z-index移动Safari浏览器

我在做一个web应用程序。当我显示覆盖图时，它覆盖了我的整个屏幕，甚至包含更大z-index的元素。当我CONSOLE.LOG的z指数，覆盖20和内容是80Z-index移动Safari浏览器

现在，我想在div前面嵌套在其他分区。这可能是问题吗？它适用于所有浏览器（FF，safari，chrome），移动Safari（iPhone）除外。

<body> 
<div id="overlay"></div> 
<div id="content"> 
<div id="thisInFront"></div> 
</div> 
</body> 

$("#overlay").fadeIn(); 
$("#thisInFront").animate({"top":"60%"},1000);

有没有办法让前面的DIV？或者我必须嵌套我的DIV否则？

来源

2012-07-05 Tom Broucke

下面是iOS上的Safari浏览器有效的解决方案：http://jsfiddle.net/ansonhoyt/E8yyH/

元素默认为position: static。为了让z-index的应用，你需要的元素拉出静态页面的喜欢的东西：#thisInFront {position: relative}。所述的jsfiddle示例显示了一个固定的位置#overlay覆盖与#thisInFront整个视口上方上升。在iPhone 4S验证iOS上的Safari 6.0。

screenshot of jsfiddle

W3cschools.com defines static position为： “元素渲染顺序，它们出现在文档流”

检查出的问题，z-index not behaving as i'd expect。这并不一定覆盖，但适用同样的规则。

来源

2012-11-19 16:59:09 Anson

Z-index移动Safari浏览器

回答

相关问题