很多朋友應該都會發現,在我的博客裡移動和點擊標題都有一些動態效果,右移的效果請移步上次寫的文章《分享本站標題鏈接平滑右移效果》,今天寫的是點擊之後的那個動態loading...的效果。兩種的效果到主頁點擊標題就可以看見啦。
首先第一步要讓網頁加載jQuery庫文件,不過現在基本上沒有什麼站沒用到jQuery了,所以第一步可以省略。
但如果沒有添加的話,可以在</head>標簽前加入以下代碼。
- <script type="text/javascript" src="http://jqueryjs.googlecode.com
- /files/jquery-1.2.3.min.js"></script>
第二步就是將下面這個代碼粘貼到網站中加載的其中一個JS文件裡,刷新一下,效果就出來了。
- /*-------------------------------------------------*/
- /* 為文章標題鏈接添加動態載入效果
- /*-------------------------------------------------*/
-
- $(function() {
- $('.entry-title a').click(function(e) {
- e.preventDefault();
- var htm = 'Loading',
- i = 4,
- t = $(this).html(htm).unbind('click'); (function ct() {
- i < 0 ? (i = 4, t.html(htm), ct()) : (t[0].innerHTML += '.',
- i--, setTimeout(ct, 150))
- })();
- window.location = this.href
- })
-