2則自己編寫的jQuery特效分享
更新時間：2015年02月26日 10:19:55 作者：時光隧道冰
這里給大家分享的是個人編寫的2個jQuery特效，非常簡單實(shí)用，推薦給大家，希望對大家能有所幫助。
先貼代碼吧
復(fù)制代碼 代碼如下:
<script type="text/javascript">
var msg=["你真?zhèn)ゴ?,"你真漂亮","該吃飯了"];
$(document).ready(function(){
$("#tijiao").click(function(){
$("#p1").html(msg[Math.floor(Math.random() * msg.length)]);
});
});
</script>
這個代碼呢是一個 JQ 的按鈕點(diǎn)擊隨機(jī)出現(xiàn)一句話的這么一個功能
要點(diǎn) 就在
復(fù)制代碼 代碼如下:
$("#p1").html(msg[Math.floor(Math.random() * msg.length)]);
這一句上面。
好了，下一段代碼
復(fù)制代碼 代碼如下:
<script language="javascript" type="text/javascript">
$(
function() {
$(".content1 ul:gt(0)").hide();
$(".tab li:first").addClass("active");
$(".tab li").css("cursor", "pointer");
$(".tab li").hover(
function(){
$(this).addClass("active").siblings().removeClass("active");
$(".content1 li").eq($(this).index()).siblings().hide().end().show();
}
)
}
);
</script>
這個是一個tab切換的效果
關(guān)鍵點(diǎn)在于
tab選項卡的div塊內(nèi)：float浮動一行顯示多個<li>。
下面對應(yīng)的contentdiv塊內(nèi)：多個div，
第一個display：block。其余none。
上下div塊內(nèi)元素的數(shù)目和順序保證一致。
后面就對<li>綁定click.
對應(yīng)相對的思路就好了！
好了，今天分享的這2則jQuery特效就先到這里了，以后慢慢分享一些其他特效，希望大家能夠喜歡。
相關(guān)文章
ztree獲取選中節(jié)點(diǎn)時不能進(jìn)入可視區(qū)域出現(xiàn)BUG如何解決
zTree 是一個依靠 jQuery 實(shí)現(xiàn)的多功能 “樹插件”。優(yōu)異的性能、靈活的配置、多種功能的組合是 zTree 最大優(yōu)點(diǎn)。本文給大家介紹ztree獲取選中節(jié)點(diǎn)時不能進(jìn)入可視區(qū)域出現(xiàn)BUG如何解決的相關(guān)資料，對ztree獲取選中節(jié)點(diǎn)感興趣的朋友一起學(xué)習(xí)吧2015-12-12
這篇文章主要介紹了jQuery中siblings()方法用法,實(shí)例分析了siblings()方法的功能、定義及獲取匹配元素集合中每一個元素的同輩元素的使用技巧,是進(jìn)行元素篩選時非常實(shí)用的方法,需要的朋友可以參考下2015-01-01
$.each是一個通用的迭代函數(shù)，可用于近似地迭代 對象和數(shù)組，這個函數(shù)與$().each是專用用于迭代和執(zhí)行jquery對象函數(shù)2014-03-03
jQuery基于事件控制實(shí)現(xiàn)點(diǎn)擊顯示內(nèi)容下拉效果
這篇文章主要介紹了jQuery基于事件控制實(shí)現(xiàn)點(diǎn)擊顯示內(nèi)容下拉效果,涉及jQuery事件響應(yīng)及元素屬性動態(tài)操作相關(guān)技巧,需要的朋友可以參考下2017-03-03
使用jQuery向asp.net Mvc傳遞復(fù)雜json數(shù)據(jù)-ModelBinder篇
jQuery提供的ajax方法能很方便的實(shí)現(xiàn)客戶端與服務(wù)器的異步交互,在asp.net mvc 框架使用jQuery能很方便地異步獲取提交數(shù)據(jù),給用戶提供更好的體驗(yàn)!2010-05-05
jQuery插件實(shí)現(xiàn)多級聯(lián)動菜單效果
開發(fā)一個jQuery插件實(shí)現(xiàn)多級聯(lián)動菜單效果，實(shí)現(xiàn)步驟很詳細(xì)，感興趣的小伙伴們可以參考一下2015-12-12
這篇文章主要介紹了jQuery中slice()方法用法,實(shí)例分析了slice()方法的功能、定義及選取匹配元素集子集的使用技巧,需要的朋友可以參考下2015-01-01
jquery實(shí)現(xiàn)疊層3D文字特效代碼分享
本文主要介紹了jquery實(shí)現(xiàn)疊層3D文字特效，實(shí)現(xiàn)很簡單2015-08-08
在前兩周國外知名博客WDL先后分享了“2010最佳系列”中的“最佳免費(fèi)WordPress主題”和“最佳免費(fèi)字體”，在這個星期又發(fā)布了2010年最佳jQuery插件。2010-12-12
jquery Mobile入門—多頁面切換示例學(xué)習(xí)
在JQuery Mobile中，多個頁面的切換是通過<a>元素、并將<href>屬性設(shè)置為#+對應(yīng)的id號的方式進(jìn)行的2013-01-01