教你网站怎么添加返回顶部代码?

网站添加返回顶部有好几种，下面我简单介绍下：1 使用文字添加方法最简单的是：最简单的“返回顶部”代码就是“返回顶部”（不包括引号），(0,0)代表座标，第一位是水平，第二位是垂直，(0,0)就表示网页左上角，文字部分（返回顶部）可以自由替换成自己需要的内容，比如也可以用“TOP”都可以。这里就是简单返回顶部的代码， 这里的 只是改成了返回游戏首页~！2。第二种复杂点HTML 结构我使用了 a 标签作为这个结构，可能不太标准，但是比较方便。在 a 标签中，内置了一个 span 标签，用来显示三角号。具体代码如下： 回到顶部对，你没看错，就这么简单的一句代码，直接在 a 标签中，填写一个三角号。剩下的就是使用 CSS 进行样式控制。CSS 代码#回到顶部{display:block; width:60px;height:60px;position:fixed; bottom:50px; right:40px;border-radius:10px 10px 10px 10px; text-decoration:none; display:none; background-color:#999999; }上面这段代码，定义了 a 标签的外观样式，定义 display 为 block，这样，我们才能指定它的 width 和 height。定义 position 为fixed，让它固定在右下角。同时为它指定圆角，就是使用 border-radius 属性，定于半径为10px的圆角。#回到顶部 span{display:block;width:60px;color:#dddddd;}#回到顶部 span:hover{color:#cccccc;}#gotop span{font-size:40px;text-align:center;margin-top:4px;}上面这一段，就是定义了 span 标签里面的三角号，至于如何打出这个“三角号”，使用搜狗输入法，按下“Ctrl + Shift + z”，就会弹出搜狗的特殊字符，就可以找到了。这几句代码意思很简单，就是定义了三角号的外观样式，同时制定了颜色变化，这是为了用户体验。最下面的 margin-top：4px，则是用来准确定位三角号，让它居中显示。jQuery 代码具体的 jQuery 代码如下，解析已经写在注释里面了：$(function(){$(window).scroll(function(){ //只要窗口滚动,就触发下面代码var scrollt = document.documentElement.scrollTop + document.body.scrollTop; //获取滚动后的高度if( scrollt >200 ){ //判断滚动后高度超过200px,就显示 $('#回到顶部').fadeIn(400); //淡出 }else{ $('#回到顶部').stop().fadeOut(400); //如果返回或者没有超过,就淡入.必须加上stop()停止之前动画,否则会出现闪动 }});$('#回到顶部').click(function(){ //当点击标签的时候,使用animate在200毫秒的时间内,滚到顶部$('html,body').animate({scrollTop:'0px'},200);});});还要下载个回到顶部的图片上传网站根目录里！怎么样，简单吧？就用这几句代码而已，就可以出现这个功能、。当然缺点也是有的，就是在IE6等过时的浏览器中，可能不会兼容，无法实现。3种，就是也很简单了，现在都有很多网站用的插件：友荐，自带返回顶部 的JS你只要是网站的拥有者，到上面去申请个号，复制它的代码，这我就不写了。很短的一段代码，复复制进自己的文章内容页：就可以了。图片都不用上传，真的很轻松，也很方便！