一個(gè)有意思的鼠標(biāo)點(diǎn)擊文字特效jquery代碼
更新時(shí)間：2017年09月23日 13:57:16 投稿：mdxy-dxy
這篇文章主要介紹了一個(gè)有意思的鼠標(biāo)點(diǎn)擊文字特效jquery代碼,需要的朋友可以參考下
今天在【幻想's Blog】看到一段比較喜歡的鼠標(biāo)點(diǎn)擊文字特效JS代碼，感覺很不錯(cuò)就用到博客上來了！喜歡的站長(zhǎng)也可以用一下感覺一下！
只需將如下JS代碼放到</body>之前即可。
<script type="text/javascript">
/* 鼠標(biāo)特效 */
var a_idx = 0;
jQuery(document).ready(function($) {
$("body").click(function(e) {
var a = new Array("富強(qiáng)", "民主", "文明", "和諧", "自由", "平等", "公正" ,"法治", "愛國(guó)", "敬業(yè)", "誠(chéng)信", "友善");
var $i = $("<span/>").text(a[a_idx]);
a_idx = (a_idx + 1) % a.length;
var x = e.pageX,
y = e.pageY;
$i.css({
"z-index": 999999999999999999999999999999999999999999999999999999999999999999999,
"top": y - 20,
"left": x,
"position": "absolute",
"font-weight": "bold",
"color": "#ff6651"
});
$("body").append($i);
$i.animate({
"top": y - 180,
"opacity": 0
},
1500,
function() {
$i.remove();
});
});
});
</script>
不知道為啥， WordPress 可以使用的JS代碼放到 Typecho 里都失效了，郁悶呀！
這個(gè)效果一般大網(wǎng)站就不用了，一般用于個(gè)人博客還是不錯(cuò)的。
您可能感興趣的文章:
- JS獲取鼠標(biāo)選中的文字
- js實(shí)現(xiàn)鼠標(biāo)懸停圖片上時(shí)滾動(dòng)文字說明的方法
- js實(shí)現(xiàn)文字垂直滾動(dòng)和鼠標(biāo)懸停效果
- js實(shí)現(xiàn)鼠標(biāo)滑過文字鏈接色彩變化的效果
- jQuery實(shí)現(xiàn)表單input中提示文字value隨鼠標(biāo)焦點(diǎn)移進(jìn)移出而顯示或隱藏的代碼
- jQuery實(shí)現(xiàn)鼠標(biāo)經(jīng)過時(shí)出現(xiàn)隱藏層文字鏈接的方法
- jQuery實(shí)現(xiàn)鼠標(biāo)單擊網(wǎng)頁文字后在文本框顯示的方法
- jQuery實(shí)現(xiàn)鼠標(biāo)選中文字后彈出提示窗口效果【附demo源碼】
- jQuery+css3實(shí)現(xiàn)文字跟隨鼠標(biāo)的上下抖動(dòng)
- jQuery實(shí)現(xiàn)鼠標(biāo)選文字發(fā)新浪微博的方法
- javascript（基于jQuery）實(shí)現(xiàn)鼠標(biāo)獲取選中的文字示例【測(cè)試可用】
相關(guān)文章
詳細(xì)解讀Jquery各Ajax函數(shù)($.get(),$.post(),$.ajax(),$.getJSON())
這篇文章主要介紹了詳細(xì)解讀Jquery各Ajax函數(shù)($.get(),$.post(),$.ajax(),$.getJSON())的相關(guān)資料,非常不錯(cuò)，具有參考借鑒價(jià)值，需要的朋友可以參考下2016-08-08
這篇文章主要介紹了jQuery中:eq()選擇器用法,實(shí)例分析了:eq()選擇器的功能、定義及匹配指定索引值元素時(shí)的使用技巧,具有一定的參考借鑒價(jià)值,需要的朋友可以參考下2014-12-12
利用jQuery 實(shí)現(xiàn)GridView異步排序、分頁的代碼
經(jīng)常會(huì)用到j(luò)query.ui.tabs標(biāo)簽，如我們可以把備份管理放在一個(gè)頁面上，而該頁面有兩個(gè)tab分別為備份和還原，但這樣會(huì)現(xiàn)在這個(gè)頁面臃腫2010-02-02
這篇文章主要為大家介紹了jQuery的核心函數(shù)和事件處理，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下，希望能夠給你帶來幫助2022-01-01
本文主要介紹了JQuery的基本知識(shí)，如：JQuery的dom操作，動(dòng)態(tài)創(chuàng)建dom節(jié)點(diǎn)，刪除節(jié)點(diǎn)，document方法等等，文章篇尾處附上實(shí)例小練習(xí)。需要的朋友可以參考下2016-12-12
jQuery實(shí)現(xiàn)的圖片輪播效果完整示例
這篇文章主要介紹了jQuery實(shí)現(xiàn)的圖片輪播效果,結(jié)合完整實(shí)例形式分析了jQuery結(jié)合時(shí)間函數(shù)動(dòng)態(tài)改變頁面元素樣式的相關(guān)技巧,需要的朋友可以參考下2016-09-09
對(duì)于JQuery是啥東東的描述我在此也就不多說了,哈,如果有興趣的話我相信不會(huì)懶的去查吧,哈^^2009-07-07
想在頁面加載完成后，有幾個(gè)地方顯示當(dāng)前時(shí)間，所以想通過jquery給多個(gè)span賦值,需要的朋友可以參考下2014-05-05
簡(jiǎn)要了解jQuery移動(dòng)web開發(fā)的響應(yīng)式布局設(shè)計(jì)
這篇文章主要介紹了jQuery移動(dòng)web開發(fā)的響應(yīng)式布局設(shè)計(jì),jQuery是JavaScript世界中最具人氣的模塊或者說類庫,需要的朋友可以參考下2015-12-12
這篇文章主要介紹了jquery中$.ajax方法提交表單的方法及介紹，希望對(duì)大家有所幫助2014-11-11