Just found that if you have a fixed item in a wrapper with overflow hidden and you jquery animate the item from the right side to the left - wash and repeat - in iPhone and Opera they both honor the overflow hidden on the wrapper and hide it from there. The others overflow hidden it from the body. Fixed items are supposed to be positioned from the body so the later behavior is “probably” correct - I’m not certain that’s a toss up? The easy fix is obviously to take the item out of the wrapper.
Yes, the overflow:hidden on the parent should have no effect on the fixed positioned element as the body element is the stacking context for fixed positioned elements. All modern browsers seem to get it right with a simple css example.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Untitled Document</title>
<style type="text/css">
div {
margin:50px;
background:red;
width:200px;
height:100px;
overflow:hidden;
position:relative;
}
p {
margin:100px 0 0;
position:fixed;
}
</style>
</head>
<body>
<div>
<p>testing</p>
</div>
</body>
</html>