如果你的网页内容比较长，用户需往下滚屏很多后想返回顶部如果没有一键返回功能就会非常麻烦，得一点点往上滚动鼠标或拉动滚动条。所以，这就需要给网站页面添加一个一键返回顶部按钮来方便的回到页面顶部。这个功能在很多网站都有，是一个非常实用的小功能。本文将介绍如何为WordPress页面增加返回顶部按钮的方法。
1、创建一个名为backtop.js的JS文件，并将以下代码插入：
/*
返回顶部按钮JS代码
代码来源: www.wpzhinan.com/jiaocheng/1755.html
*/
// 0) {
goto_top_itv = setInterval('goto_top_timer()', 50);
}
}
}
//]]>
2、添加返回顶部按钮CSS样式代码到主题文件style.css中：
/*返回顶部按钮*/
#scroll {display:block; width:30px; margin-right:-380px;
position:fixed;
right:50%;
top:90%;
_margin-right:-507px;
_position:absolute;
_margin-top:30px;
_top:expression(eval(document.documentElement.scrollTop));
}
#scroll a {
display:block;
float:right;
padding:9px 5px;
cursor: pointer;
background-color:#444;
color:#fff;
border-radius:5px;
text-decoration: none;
font-weight:bold;
}
#scroll a:hover {
background-color:#333;
color:#669900;
text-decoration: none;
font-weight:bold;
}
3、在主题包内的footer.php文件中插入以下代码:
代码说明：你可以将backtop.js文件放入主题包文件夹内，但需修改第三步中的JS代码引用地址。以上示例是将JS文件放到网站根目录下。至于CSS样式，你可以根据自己的主题需要进行调整，也可自定义。如果你想把上述的JS代码插入主题主JS文件，也是可以的。
本文地址：http://www.wpzhinan.com/jiaocheng/1755.html
版权申明：除部分代码外，本站内容均为原创，转载请注明来源，违者必究侵权责任！
