wordpress回頂部 wordpress恢復(fù)初始頁面

如何為WordPress主題添加一個返回頂部按鈕

一、確保你的主題已經(jīng)加載jQ庫，然后將以下js代碼以gototop.js文件保存，放在主題的目錄下：

創(chuàng)新互聯(lián)是一家集網(wǎng)站建設(shè),若羌企業(yè)網(wǎng)站建設(shè),若羌品牌網(wǎng)站建設(shè),網(wǎng)站定制,若羌網(wǎng)站建設(shè)報價,網(wǎng)絡(luò)營銷,網(wǎng)絡(luò)優(yōu)化,若羌網(wǎng)站推廣為一體的創(chuàng)新建站企業(yè)，幫助傳統(tǒng)企業(yè)提升企業(yè)形象加強企業(yè)競爭力?？沙浞譂M足這一群體相比中小企業(yè)更為豐富、高端、多元的互聯(lián)網(wǎng)需求。同時我們時刻保持專業(yè)、時尚、前沿，時刻以成就客戶成長自我，堅持不斷學(xué)習(xí)、思考、沉淀、凈化自己，讓我們?yōu)楦嗟钠髽I(yè)打造出實用型網(wǎng)站。

jQuery(document).ready(function($)?{

$body?=?(window.opera)???(document點抗 patMode?==?"CSS1Compat"???$("html")?:?$("body"))?:?$("html,body");

$("#shang").mouseover(function()?{

up()

}).mouseout(function()?{

clearTimeout(fq)

}).click(function()?{

$body.animate({

scrollTop:?0

400)

});

$("#xia").mouseover(function()?{

dn()

}).mouseout(function()?{

clearTimeout(fq)

}).click(function()?{

$body.animate({

scrollTop:?$(document).height()

400)

});

$("#comt").click(function()?{

$body.animate({

scrollTop:?$("#comments").offset().top

400)

});

function?up()?{

$wd?=?$(window);

$wd.scrollTop($wd.scrollTop()?-?1);

fq?=?setTimeout("up()",?50)

};

function?dn()?{

$wd?=?$(window);

$wd.scrollTop($wd.scrollTop()?+?1);

fq?=?setTimeout("dn()",?50)

};

二、打開主題的footer.php，在最后加入以下代碼：

script?type="text/javascript"?src="?php?bloginfo('template_directory');?/js/gototop.js"/script

div?id="shangxia"

div?id="shang"?title="↑?返回頂部"/div

?php?if?(?is_singular()?){??

div?id="comt"?title="查看評論"/div

?php?}??

div?id="xia"?title="↓?移至底部"/div

/div

/js/gototop.js需要改為與你的實際路徑。

三、將以下css代碼丟入主題的style.css中：

#shangxia{position:fixed;top:45%;right:50%;display:block;margin-right:-540px;z-index:999;}

#shang,#comt,#xia{background:url(gototop.png)?no-repeat;position:relative;cursor:pointer;

height:25px;width:29px;margin:10px?0?0;}

#comt{background-position:left?-30px;height:32px;}

#xia{background-position:left?-68px;}

#comt:hover{background-position:right?-30px;}

#shang:hover{background-position:right?0;}

#xia:hover{background-position:right?-68px?;}

上面的css相關(guān)代碼有些需要修改。

求助：如何修改wordpress回到頂部

一般在主題模板里面修改，如果主題代碼里面沒找到你需要改的話，可以在外觀/菜單,里面看看是不有你要改的地址。

WordPress網(wǎng)站返回頂部按鈕怎么添加

WordPress網(wǎng)站返回頂部按鈕添加方法：

重寫window.onscroll()事件，先將返回頂部div設(shè)置為position:fixed;right:10px;bottom:10px;display:none，一旦event.scrollTop100(100可以設(shè)置為你想要的值)就display:block（fadeIn()），否則display:none(fadeOut())。還要設(shè)置返回頂部div點擊事件，onclick(function(){$('body,html').animate({scrollTop:0},1000);})，這個什么意思不用我多說吧，既然搞Jquery，動畫還是應(yīng)該曉得。

style type="css/text"

#gotop{position:fixed;right:10px;bottom:10px;display:none}

/style

div id="gotop"/div

script type="javascript/text"

$(function(){

$(window).scroll(function(){

if($(window).scrollTop 100){

$("#gotop").fadeIn(1000);//一秒漸入動畫

}else{

$("#gotop").fadeOut(1000);//一秒漸隱動畫

}

});

$("#gotop").click(function(){

$('body,html').animate({scrollTop:0},1000);

});

/script

wordpress 怎么編輯返回頂部插件

用戶一般都是自上而下瀏覽完網(wǎng)站，瀏覽完后就要返回網(wǎng)站頂部，一般的網(wǎng)站都添加了返回頂部的功能，方便用戶快速到達網(wǎng)站頂部，而不必去滾動鼠標。如果你不懂得代碼，沒關(guān)系，wp auto top這個WordPress插件將幫你實現(xiàn)這個功能。

下面將詳細介紹WordPress返回頂部插件wp auto top的使用方法。

1/3

先安裝wp auto top插件。登陸WordPree后臺，按如下步驟操作：

2/3

安裝好了之后，不用任何設(shè)置，打開網(wǎng)站首頁，在左側(cè)會看到如下圖的兩個箭頭，點擊向上的箭頭，回到網(wǎng)站頂部，點擊向下的箭頭，回到網(wǎng)站底部。

3/3

另外，我們在“設(shè)置”》“wp-auto-top”里面可以設(shè)置它的圖片顏色、顯示頁面、顯示位置、浮層層高等等。

文章題目：wordpress回頂部 wordpress恢復(fù)初始頁面
分享鏈接：http://muchs.cn/article38/ddieisp.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián)，為您提供、商城網(wǎng)站、搜索引擎優(yōu)化、網(wǎng)站排名、網(wǎng)站導(dǎo)航、網(wǎng)站設(shè)計

聲明：本網(wǎng)站發(fā)布的內(nèi)容（圖片、視頻和文字）以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主，如果涉及侵權(quán)請盡快告知，我們將會在第一時間刪除。文章觀點不代表本網(wǎng)站立場，如需處理請聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載，或轉(zhuǎn)載時需注明來源：創(chuàng)新互聯(lián)

猜你還喜歡下面的內(nèi)容