本文实例讲述了WordPress添加前往顶部成果的办法。分享给大家供大家参考。详细完成办法如下:
前往顶部成果不是WordPress自带的性能,这是一款js或jquery的成果,这里就来给大家引见在WordPress中添加反回顶部成果的办法.
**步:在上面主题文件footer.php底下加上这段代码:
<script src="top.js" type="text/javascript" charset="utf-8"></script >
<p id="scroll"><a href="javascript:void(0)" onclick="goto_top()" title="前往顶部">TOP</a></p>
//<![CDATA[
var goto_top_type = -1;
var goto_top_itv = 0;
function goto_top_timer()
{
var y = goto_top_type == 1 ? document.documentElement.scrollTop : document.body.scrollTop;
var moveby = 15;
y -= Math.ceil(y * moveby / 100);
if (y < 0) {
y = 0;
}
if (goto_top_type == 1) {
document.documentElement.scrollTop = y;
}
else {
document.body.scrollTop = y;
}
if (y == 0) {
clearInterval(goto_top_itv);
goto_top_itv = 0;
}
}
function goto_top()
{
if (goto_top_itv == 0) {
if (document.documentElement && document.documentElement.scrollTop) {
goto_top_type = 1;
}
else if (document.body && document.body.scrollTop) {
goto_top_type = 2;
}
else {
goto_top_type = 0;
}
if (goto_top_type > 0) {
goto_top_itv = setInterval('goto_top_timer()', 50);
}
}
}
//]]>
/*前往顶部*/
#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;
}
心愿本文所述对大家的WordPress建站有所协助。
以上就是安达网络工作室关于《WordPress增加返回顶部效果的方法》的一些看法。更多内容请查看本栏目更多内容!
我的优化步骤是: 1.紧缩CSS和JS文件,并修正一局部插件,优化页面的载入过程 普通需求另外加载JS或许CSS的...
作者 查问和某些作者(用户)无关的文章,能够应用 4 个参数: author(整数):用户 ID author_name(...
明天偶尔留意到WordPress的分类和标签隐没了,开端认为是数据库表损坏,于是经过PHPMyAdmin修复表,然而留意...
在WordPress中时常存在某些文章不需求题目的状况,特地是在一些集体网站,他们经常应用一些不需求题目的pos...
本文实例讲述了Wordpress完成单篇文章分页显示的办法。分享给大家供大家参考。详细剖析如下: 很多冤家都晓...
露兜博客首页的访客可自行抉择文章排序形式的成果是怎样做的,明天就来给大家分享这个文章排序成果的完成进...