我的页面在firefox中的显示方式与在safari中显示的不同

时间:2012-09-02 12:57:23

标签: firefox safari spry easing

我正在为一个客户端开发一个微型网站,而且工作得很好,除非我尝试在firefox上查看它时,我对于看起来错误的东西感到惊讶。即使我禁用了水平滚动,在Firefox中你仍然可以做到(没有看到水平滚动,但如果你水平滚动它显示),即使webfont是不同的,虽然webfont在其他页面的firefox上完美显示..第三个问题是页面顶部边距,在页面属性中我指定边距为0并且在safari中它工作,但在Firefox中它没有。任何人都可以告诉我该怎么做..我只有一个spry菜单栏和缓动(animate2id)插件可能导致问题可能?在Safari中,它看起来像我希望它的样子..提前谢谢.. 也许我应该提一下,我是一个新手,我通过自学来了解自己的知识。

这是代码中的代码..

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Annual Report 2012</title>
<link href='http://fonts.googleapis.com/css?family=PT+Sans' rel='stylesheet' type='text/css'>
<link href="micro-site.css" rel="stylesheet" type="text/css" />
<script src="SpryAssets/SpryMenuBar.js" type="text/javascript"></script>
<link href="SpryAssets/SpryMenuBarHorizontal.css" rel="stylesheet" type="text/css" />
<style type="text/css">
body {
background-color: #39949C;
overflow-x: hidden;
}
</style>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js" type="text/javascript"></script>
<script src="jquery.easing.1.3.js" type="text/javascript"></script>


<link href="muli-fontfacekit/stylesheet.css" rel="stylesheet" type="text/css" />

<body leftmargin="0" topmargin="0">


<div id="rotator-controls" class="panel span2">
<div id="rotator-slides">
<a class="" href="micro-site.html" onclick="Animate2id('.slide-content'); return false" title="Go to 1st content with the default easing">1</a>

<a class="" href="#slide-content2" onclick="Animate2id('#slide-content2','easeInOutExpo'); return false">2</a>

<a class="" href="#slide-content3" onclick="Animate2id('#slide-content3','easeInOutExpo'); return false">3</a>

<a class="" href="#slide-content4" onclick="Animate2id('#slide-content4','easeInOutExpo'); return false">4</a>

<a class="" href="#slide-content5" onclick="Animate2id('#slide-content5','easeInOutExpo'); return false">5</a>
</div>

<div id="rotator-nav">

<a href="#" class="prev">‹</a>
<a href="#" class="next">›</a>
</div>
</div>

</div><!--end of header -->

</div><!--end of slide-container -->
</div><!--end of body -->


<div id="Sitemap"></div>


</div><!--end of container -->

</div>

<script type="text/javascript">
var MenuBar1 = new Spry.Widget.MenuBar("MenuBar1",     {imgDown:"SpryAssets/SpryMenuBarDownHover.gif", imgRight:"SpryAssets/SpryMenuBarRightHover.gif"});
function Animate2id(id,ease){ //the id to animate, the easing type
    var animSpeed=2000; //set animation speed
var $container=$("#slide-container"); //define the container to move
if(ease){ //check if ease variable is set
    var easeType=ease;
} else {

    var easeType="easeOutQuart"; //set default easing type
}
//do the animation
$container.stop().animate({"left": -($(id).position().left)}, 2000, easeType);
}
</script>

0 个答案:

没有答案