回到顶部javascript代码

回到网页顶部的效果不少，有加个#的，有滑上去，有弹上去的。但是把几种 jQuery 效果混合起来回到顶部大概不多。纠其原因，此举除了有让一些急性子的人等不及效果结束就关闭网页的可能，另一个重要原因是因为 IE家族对 JS 微“软”的支持。几种漂亮的效果加在一起，在 IE 下却是惨不忍睹。
但这不能阻碍我们对视觉享受的追求。
下面是我晚上写的一段代码，预览请尽量在 chrome,firefox中完成。
首先加载:

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js" type="text/javascript"><!--mce:0--></script>

把以下代码保存调用：

$(document).ready(function(){
$('#gotop').click(function(){
$('#wrap').fadeTo("200", 0.3, function(){$('html, body').animate({scrollTop: 0},800);});
$('#wrap').delay(800).fadeTo("200", 1);
});
});

请根据实际主题代码更换：#gotop、#wrap

补充：如果加载的是 jQuery 1.4以下的版本，使用以下代码：

$(document).ready(function(){
$('#gotop').click(function(){
$('#wrap').fadeTo("100", 0.2, function(){$('html, body').animate({scrollTop: 0},800, function(){$('#wrap').fadeTo("100", 1);});});
});
});

发表评论 取消回复

发表评论取消回复