很多Z-Blog博客用户的内容太多或者评论太多,看了一会想回到顶部或者写评论的话,需要拖动鼠标很长时间,才能到达顶部或者评论,因此对于文章内容太多和评论太多的Z-Blog博客建议添加写评论和回顶部的浮动代码,上次看了卢松松博客的这个浮动代码后,但是对新手来说,不知道具体放在那里,这里126设计网整理后分享给大家。具体代码如下:
lastScrollY=0;
function heartBeat(){
var diffY;
if (document.documentElement && document.documentElement.scrollTop)
diffY = document.documentElement.scrollTop;
else if (document.body)
diffY = document.body.scrollTop
else
{/*Netscape stuff*/}
percent=.1*(diffY-lastScrollY);
if(percent>0)percent=Math.ceil(percent);
else percent=Math.floor(percent);
document.getElementById("full").style.top=parseInt(document.getElementById("full").style.top)+percent+"px";
lastScrollY=lastScrollY+percent;
/*if(diffY == 0){document.getElementById("full").style.display = "none"}
else{document.getElementById("full").style.display = "block"}
}*/
if(diffY > 500){document.getElementById("full").style.display = "block"}
else{
document.getElementById("full").style.display = "none"}
}
suspendcode="<div id=\"full\" style='display:none; width:15px; height:57px; POSITION:absolute; left:50%; top:460px; margin-left:133px; z-index:100; text-align:center;'><a href='#'><img src='../THEMES/Qeeke/STYLE/Qeeke/btn_top.gif' border=0 /></a><br><a href='http://weixiao86.com/'><img src='../THEMES/Qeeke/STYLE/Qeeke/btn_home.gif' border=0 /></a><br><a href='#comment'><img src='../THEMES/Qeeke/STYLE/Qeeke/btn_comment.gif' border=0 /></a></div>"
document.write(suspendcode);
window.setInterval("heartBeat()",1);
function switchImage(imageId, imageUrl, linkId, linkUrl, preview, title, alt) {
if(imageId && imageUrl) {
var image = $(imageId);
image.src = imageUrl;
if(title) {
image.title = title;
}
if(alt) {
image.alt = alt;
}
}
if(linkId && linkUrl) {
var link = $(linkId);
link.href = linkUrl;
}
}
//Tabs
function setTab(name,cursel,n){
for(i=1;i<=n;i++){
var menu=document.getElementById(name+i);
var con=document.getElementById("con"+name+i);
menu.className=i==cursel?"current":"";
con.style.display=i==cursel?"block":"none";
}
}
把上面的代码保存为后缀名为.js的文件,然后保存到博客主题文件夹的SCRIPT文件夹就可以了,然后在内容页面single.html调用就行了,调用代码写在<head>和</head>之间,具体代码:<script type="text/javascript" src="<#ZC_BLOG_HOST#>THEMES/<#ZC_BLOG_THEME#>/SCRIPT/top.js"></script>因为我把浮动代码保存为top.js,因此这里调用的就是top.js,然后保存,还要记得保存这几个图片哦,把图片保存在主题里的STYLE文件夹里的和主题名字一样的文件夹里就好啦,接下来随便打开一篇文章,看看是不是就有浮动的写评论和回顶部按钮了。