因为要用到JQuery所以首先要确保在html网页的<head> section 中含有如下代码(版本可能不一样)

<script src=”http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js”></script&gt;

然后在Html<body> section 合适的位置加入代码,可以是文字链接也可以是图片链接。这个就是用户要点击并返回页首的按钮。

<a id = “gotop” href = “#” title = “返回顶部”><img src=”http://xxx.xxx.com/ad/back-to-top.png&#8221; width=”50px” height=”50px”/></a>

有了按钮后,我们要定义,用户点这个按钮时要有什么动作发生。在网页中任意地方写入JavaScript代码,这段代码就是用来执行用户点击的命令的(注意gotop要和之前html 链接的 id“gotop”相同:

<script type = “text/javascript”>
$(function(){

$(“#gotop“).click(function(){

$(“html,body”).animate({scrollTop:0},900);

return false;

});

});
</script>

实例可以到http://www.weidaily.com查看

Advertisements

发表评论

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / 更改 )

Twitter picture

You are commenting using your Twitter account. Log Out / 更改 )

Facebook photo

You are commenting using your Facebook account. Log Out / 更改 )

Google+ photo

You are commenting using your Google+ account. Log Out / 更改 )

Connecting to %s