1.到 scrollUp jQuery Plugin 網站下載Plugin,或直接從這下載
2.將jquery.scrollUp.min.js放到自己的Google雲端硬碟,然後取得這個檔案的連結網址
- 先到雲端硬碟裡找到這個檔案,在檔案上按右鍵選共用
- 在"擁有存取權的使用者"右邊按"變更",選"開啟-公開在網路上"
- 儲存
- 複製上面的共用連結(長的像這樣https://drive.google.com/file/d/0Bz3l7GOrn1j5UV123mRlc1lWTjA/view?usp=sharing)
- 將紅色的部份放到https://googledrive.com/host/後面,變這樣https://googledrive.com/host/0Bz3l7GOrn1j5UV123mRlc1lWTjA
3.將上一步得到的網址修改到下面script藍色的部份
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js'/>
<!-- scrollUp jQuery plugin -->
<script src="https://googledrive.com/host/0Bz3l7GOrn1j5UV123mRlc1lWTjA" type="text/javascript"></script>
4.將上一步的script程式碼放到Google範本的HTML原始碼的</head>之前
5.將Back to Top按鈕的圖片上傳到網路空間,將圖片網址修改到下面CSS的藍色部份
/* Image style */
#scrollUp {
bottom: 20px;
right: 20px;
height: 38px; /* Height of image */
width: 38px; /* Width of image */
background: url(http://2.bp.blogspot.com/--EgHE5Oau7o/UpsYYWRE8YI/AAAAAAABQE8/l6arzEsDIeQ/s1600/top.png) no-repeat;
}
6.將下面這段Script放到Google範本的HTML原始碼的</body>之前
<script>
$(function () {
$.scrollUp({
scrollImg: true // Set true to use image
});
});
</script>
這樣就完成了
沒有留言:
張貼留言