包含回到当前页面顶部代码的词条

今天给各位分享回到当前页面顶部代码的知识，其中也会对进行解释，如果能碰巧解决你现在面临的问题，别忘了关注本站，现在开始吧！

本文目录一览：

• 1、网页中“返回顶部”的html代码怎么编写？
• 2、网页设计返回上一页的代码
• 3、hbuilder返回顶部代码

网页中“返回顶部”的html代码怎么编写？

网站的网页中都有返回顶部的功能，就是当用户访问网页时，可以迅速的返回顶部。也许会有人觉得这个功能很简单，没有什么说的，但据我目前所知，就有五种方法实现这个功能。而且不同的方法能实现的效果也是有所不同的。下面介绍下这些方法网页中“返回顶部”的html代码有好几种不同的编写方式：

1、简单的脚本可实现此功能：

代码：

!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" ""

html xmlns=""

head

meta http-equiv="Content-Type" content="text/html; charset=gb2312" /

title返回顶部/title

style type="text/css"

body{height:1000px;}

/style

/head

body

div style="height:800px; width:800px;"/div

a href="javascript:scroll(0,0)"返回顶部/a

/body

/html

2、采用JS实现返回顶部：

!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" ""

html xmlns=""

head

meta http-equiv="Content-Type" content="text/html; charset=gb2312" /

title返回顶部/title

style type="text/css"

body{height:1000px;}

/style

/head

body

div style="height:800px; width:800px;"/div

script src="js/gototop.js"/script

div class="back-top-container" id="gotop"

div class="yb_conct"

div class="yb_bar"

ul

li class="yb_top"返回顶部/li

/ul

/div

/div

/div

/body

/html

3、利用锚点返回顶部：

!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" ""

html xmlns=""

head

meta http-equiv="Content-Type" content="text/html; charset=gb2312" /

title返回顶部/title

/head

body

a href="#5F"顶部/a

div style="height:300px; width:300px;"/div

a name="5F"返回顶部/a

/body

/html

网页设计返回上一页的代码

1、新建一个html文件，命名为test.html，用于讲解js如何实现返回上一页,并刷新页面。

2、在test.html文件内，使用a标签创建一个链接，链接的地址是test2.html页面。

3、再新建一个html文件，命名为test2.html，用于实现返回上一页，即返回test.html页面。

4、在test2.html文件内，使用a标签创建一个链接，跳转的地址设置为“#”（href="#"），同时给该链接绑定onclick点击事件。

5、在test2.html文件内，将onclick事件绑定backurl()函数，即当链接被点击时，执行backurl（）函数。

6、在test2.html文件的js标签内，创建backurl()函数，在函数内，使用document.referrer获得上一个页面的地址，再通过self.location跳转至上一个页面。

7、在浏览器打开test.html文件，查看实现的效果。

hbuilder返回顶部代码

hbuilder返回顶部代码如下面步骤。

1、操作scrooll函数用来控制滚动条的位置（第一个参数是水平位置，第二个参数是垂直位置）。

2、动态按需加载返回顶部，css侧边屏幕绝对定位，结合简单jQuery。

3、将代码复制进HTML文件中，打开即可实现。

回到当前页面顶部代码的介绍就聊到这里吧，感谢你花时间阅读本站内容，更多关于、回到当前页面顶部代码的信息别忘了在本站进行查找喔。