我遇到了溢出问题：隐藏内容，但仅限于 FF。
我有两个 div（垂直箭头的每一侧，见上文）每个都有溢出：隐藏应用屏蔽它们各自的子 div。子元素正在通过 jQuery 旋转 onscroll 事件。无论出于何种原因，每个子元素中的背景图像都没有像它们的父 div 那样被屏蔽。
看到这种不一致； http://www.pearman.com.au/
奇怪的是，在 Firebug 中检查任何父 CSS 属性时会出现子内容。
编辑：找到 CSS / HTML / JQuery
每次更新 onscroll 时都会运行此代码（很多）；
scrollAnimations.push({ 'start': 0, 'end': 450,
'callback': function(scrollTop,scrollDirection){
ran_one.css({
'-ms-transform': 'rotate('+ -(scrollTop)*0.4 +'deg)',
'-webkit-transform': 'rotate('+ -(scrollTop)*0.4 +'deg)',
'-moz-transform': 'rotate('+ -(scrollTop)*0.4 +'deg)',
'-o-transform': 'rotate('+ -(scrollTop)*0.4 +'deg)',
'transform': 'rotate('+ -(scrollTop)*0.4 +'deg)' })
}
});
scrollAnimations.push({ 'start': 0, 'end': 900,
'callback': function(scrollTop,scrollDirection){
ran_two.css({
'-ms-transform': 'rotate('+ -(scrollTop)*0.4 +'deg)',
'-webkit-transform': 'rotate('+ -(scrollTop)*0.4 +'deg)',
'-moz-transform': 'rotate('+ -(scrollTop)*0.4 +'deg)',
'-o-transform': 'rotate('+ -(scrollTop)*0.4 +'deg)',
'transform': 'rotate('+ -(scrollTop)*0.4 +'deg)' })
}
});
CSS ;
#rainbow-mask-right{
width:421px;
height:421px;
display:block;
position:absolute;
bottom:0;
left: 50%;
overflow:hidden;
}
#rainbow-mask-left{
width:421px;
height:421px;
display:block;
position:absolute;
bottom:0;
left: 50%;
overflow:hidden;
margin-left: -420px;
visibility:visible;
}
#ran-one{
background:url(images/home/rainbow/ran-dash.gif) no-repeat;
width:421px;
height:421px;
display:block;
top: 421px;
position: absolute;
transform: rotate(50deg);
-ms-transform: rotate(50deg); /* IE 9 */
-webkit-transform: rotate(50deg); /* Safari and Chrome */
-moz-transform: rotate(50deg); /* Firefox */
-o-transform: rotate(50deg); /* Opera */
}
#ran-two{
background:url(images/home/rainbow/ran-colour.gif) no-repeat transparent;
width:421px;
height:421px;
display:block;
top: 421px;
position: absolute;
left: 421px;
}
.set-origin {
transform-origin:0 0;
-ms-transform-origin:0 0; /* IE 9 */
-webkit-transform-origin:0 0; /* Safari and Chrome */
-moz-transform-origin:0 0; /* Firefox */
-o-transform-origin:0 0; /* Opera */
}
和 HTML
<div id='rainbow-mask-right'><div id='ran-one' class="set-origin"></div></div>
<div id='rainbow-mask-left'> <div id='ran-two' class="set-origin"></div></div>
