- 點選 MenuBar。
- 尋找文章。
- 閱讀文章(由上至下)。
- 返回頁首之按鍵(快速回到 MenuBar 找尋其他文章)。
##ReadMore##
Step1.
Step1.
至 scrollUp jQuery Plugin 網站下載 scrollup-master.zip 之套件,並解壓縮之。
Step2.
參考文章「以 Google Drive 分享超連結供 Blogger 使用」,至解壓縮後的目錄之路徑:scrollup-master/dist/,將其中的 jquery.scrollUp.min.js 上傳至網路空間並取得其網址。
Step3.
上傳自己喜歡的圖示(建議 48×48 .icon 檔) 或是至解壓縮後的目錄之路徑:scrollup-master/demo/img/,將 top.png 上傳至網路空間並取得其網址。
Step4.
至 Blogger 「設計」→「範本」→「編輯HTML」→
找到 <head>...</head> ,直接在 <head> 後方加入下 Code:
<!-- scrollUp jQuery Plugin START --> <script src='//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js'/> <!-- scrollUp jQuery plugin --> <script src='https://googledrive.com/host/0BxEiZ5gd9umbd09LMENDcGh1NXc' type='text/javascript'/> <script> $(function () { $.scrollUp({ scrollImg: true // Set true to use image }); }); </script> <!-- scrollUp jQuery Plugin END -->
其中,第 4 行之 src=... 請改成 Step2. 檔案 jquery.scrollUp.min.js 網址。
Step5.
至 Blogger 「設計」→「範本」→「編輯HTML」→
找到<b:skin>...</b:skin>,直接在 ]]></b:skin> 前方加入下 Code:
/********** scrollUp jQuery Plugin START **********/ #scrollUp { bottom: 20px; right: 20px; height: 64px; /* Height of image */ width: 64px; /* Width of image */ background: url(https://googledrive.com/host/0BxEiZ5gd9umba1haeG5oY2d1OTQ) no-repeat; } /********** scrollUp jQuery Plugin END **********/
其中,第 7 行之 url(...) 請改成 Step3. 之圖示網址。
---
Reference:
Reference: