jQuery應用
BY 阿茂的隨手札記
WordPress從2.7版之後內建了jQuery,jQuery的優點就在於能夠兼容各種不同的瀏覽器,一些網頁效果也可以利用jQuery來達成。
很多網站底部都會設置個 To Top回到網站頂部,雖然說用處不大,不過對於一些文章落落長的網站來說是比較方便的(?),現在將jQuery應用在此處一樣可以達成效果,並且只需要兩個步驟。
步驟一︰【/wp-content/themes/使用中版型/header.php】
在<head>與</head>處加上
<script type="text/javascript"src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script> <script type="text/javascript" src="http://檔案放置網址/scrolltopcontrol.js"></script>
★第一行的jquery.min.js直接調用Google的,至於scrolltopcontrol.js檔案請從下方載點下載後放置到網路空間上調用。
載點︰請按此處下載
步驟二︰【/檔案放置位址/scrolltopcontrol.js】
尋找下列語法
<img src="up.png" style="width:48px; height:48px" />
想要改成文字的
替換為
<a href=”#top”>Back to Top</a>
★在原語法中的up.png,為圖像檔位址,可自行製作圖像上傳並改為圖像的位址,而改為文字的可以利用css(#top)來美化。
完成之後,只要捲軸拉離Top處就可以在網站右下方看到Back to Top的提示,不需要太繁瑣的修改即可實現。