2則自己編寫的jQuery特效分享
先貼代碼吧
<script type="text/javascript">
var msg=["你真?zhèn)ゴ?,"你真漂亮","該吃飯了"];
$(document).ready(function(){
$("#tijiao").click(function(){
$("#p1").html(msg[Math.floor(Math.random() * msg.length)]);
});
});
</script>
這個(gè)代碼呢是一個(gè) JQ 的按鈕點(diǎn)擊隨機(jī)出現(xiàn)一句話的這么一個(gè)功能
要點(diǎn) 就在
$("#p1").html(msg[Math.floor(Math.random() * msg.length)]);
這一句上面。
好了,下一段代碼
<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>
這個(gè)是一個(gè)tab切換的效果
關(guān)鍵點(diǎn)在于
tab選項(xiàng)卡的div塊內(nèi):float浮動一行顯示多個(gè)<li>。
下面對應(yīng)的contentdiv塊內(nèi):多個(gè)div,
第一個(gè)display:block。其余none。
上下div塊內(nèi)元素的數(shù)目和順序保證一致。
后面就對<li>綁定click.
對應(yīng)相對的思路就好了!
好了,今天分享的這2則jQuery特效就先到這里了,以后慢慢分享一些其他特效,希望大家能夠喜歡。
相關(guān)文章
javascript向后臺傳送相同屬性的參數(shù)即數(shù)組參數(shù)
在傳送參數(shù)時(shí),經(jīng)常會碰到向后臺傳送一些相同屬性的參數(shù),最好的選擇是采用數(shù)組的方式,下面有個(gè)不錯(cuò)的示例,大家可以參考下2014-02-02jquery tools系列 expose 學(xué)習(xí)
不知不覺,已經(jīng)進(jìn)行到了jquery tools六大功能的第五個(gè)功能——expose的學(xué)習(xí)了,廢話不多說,直接進(jìn)入正題。2009-09-09jquery提取元素里的純文本不包含span等里的內(nèi)容
如何實(shí)現(xiàn)提取元素里的純文本,不包含span等里的內(nèi)容,這就是本文要為大家介紹的重點(diǎn),你將學(xué)會使用jquery來實(shí)現(xiàn)2013-09-09jQuery的DOM操作之刪除節(jié)點(diǎn)示例
如果文檔中某一個(gè)元素多余,那么應(yīng)將其刪除。jQuery提供了兩種刪除節(jié)點(diǎn)的方法,remove()方法和empty()方法下面為大家詳細(xì)介紹下2014-01-01jQuery取得元素標(biāo)簽名稱小結(jié)(附代碼)
這篇文章主要介紹了 jquery如何取得元素標(biāo)簽名稱,將html和js代碼附上,具體操作步驟大家可查看下文的詳細(xì)講解,感興趣的小伙伴們可以參考一下。2017-08-08TextArea不支持maxlength的解決辦法(jquery)
自己寫了一個(gè)jquery的擴(kuò)展,這樣就可以很容易實(shí)現(xiàn)對textarea控制最大長度了。2011-09-09