不同的边缘在所有浏览器，但IE8 /歌剧

不同的边缘我在所有的浏览器，但IE/OPera，我设置div的margin-top在-800px，如果我跟踪IE中的div位置与Opera相同，但是在FF/Chrome中它增加了300px，所以它表示Div在-1100px处于边缘顶部。不同的边缘在所有浏览器，但IE8 /歌剧

我已经看到最好的做法是使用填充而不是边距，但我对整个概念很新颖。到目前为止，我无法看到这300多个像素来自哪里。实际上，我将这个div放在我的html的beginnig中，并放在html的开头，正好位于开始body标签的下方（正如它现在），正好位于body标签正上方的botton处，两者的结果相同的额外像素。

你可以在这里看到问题：http://www.kassandrafoto.com/如果你点击Kassandra Cruz的顶部主菜单，你会看到额外的边距或300像素的差距，我想要的设计在FireFox或Chrome，但在这情况很奇怪，IE浏览器正在工作，因为我想这样做：margin-top是-800而不是-1100（动画是正确的，因为我玩这种差异，但我的问题在于这里的那些300像素来自哪里？

这是div的有问题的CSS：

#kassaInfo{ 

width:745px; 
height:671px; 
color:#74CCE5; 
position:absolute; 
margin:0px; 
z-index:1000; 
left:50%; 
margin-top:-800px; 
background-image:url(http://www.kassandrafoto.com/images/kassaInfo.png); 
background-repeat:no-repeat; 

} 

body{ 

margin:0; 
width:100%; 
height:100%; 
background-color:#fff; 
font-family:Arial, Helvetica, sans-serif; 
background-image:url(http://www.kassandrafoto.com/images/bg.jpg); 
background-repeat:repeat-x; 
overflow:hidden; 
}

这是HTML代码，你可以看到在div是第一位的：

<body id='body'> 

<div id="kassaInfo"> 
<div id="closeKassaBtn"></div> 
</div><!--The rest of the Code--> 
</body>

这里来与它的第一个行动的js，这仅仅集中在剩余股利基地的witdh的一半（这工作得很好），所以自leftted 50％打算在中心始终。 PS。我使用了Greensock TweenMax JS库，但它只是一个补间动画。

var $kassaInfo = document.getElementById('kassaInfo'); 
var $kassaMargin = findMargin('kassaInfo'); 
TweenMax.to($kassaInfo,1,{css:{alpha:0.6, marginLeft:$kassaMargin},ease:Expo.easeOut});

这里是Click事件功能：

var $kassaInfo= document.getElementById('kassaInfo'); 
TweenMax.to($kassaInfo,1{css{alpha:1, marginTop:220},ease:Expo.easeOut});

那么这里谈到的东西，你可以看到的股利是从外面任何人，是绝对的，我不知道为什么FF/Chrome中的额外空间。

感谢您的帮助或提示，可以帮助我。问候。

来源

2013-02-11 Diego

你是否知道你的网站是JS禁用的黑色虚空？ – Eevee 2013-02-11 20:58:37

噢，我想要设计一个闪光的味道，JavaScript以某种方式回来。 – Diego 2013-02-11 21:12:16

使用top而不是margin-top是正确的方法，正如我所说我很新手，所以在使用position：absolute时我不知道这个小小的不同。就像是绝对没有余量，只是简单的左，顶部等

无论如何，我无法弄清楚为什么额外300px，如果有人可以添加一些信息，这将是非常感激。

问候。

来源

2013-02-11 23:21:24 Diego

不同的边缘在所有浏览器，但IE8 /歌剧

回答

相关问题