先貼代碼吧
代碼如下:
<script type="text/javascript">
var msg=["你真偉大","你真漂亮","該吃飯了"];
$(document).ready(function(){
$("#tijiao").click(function(){
$("#p1").html(msg[Math.floor(Math.random() * msg.length)]);
});
});
</script>
這個代碼呢是一個 JQ 的按鈕點擊隨機出現一句話的這麼一個功能
要點 就在
代碼如下:
$("#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>
這個是一個tab切換的效果
關鍵點在於
tab選項卡的div塊內：float浮動一行顯示多個<li>。
下面對應的contentdiv塊內：多個div，
第一個display：block。其余none。
上下div塊內元素的數目和順序保證一致。
後面就對<li>綁定click.
對應相對的思路就好了！
好了，今天分享的這2則jQuery特效就先到這裡了，以後慢慢分享一些其他特效，希望大家能夠喜歡。