jquery第十七課,jquery特效處理2,對象的淡入淡出,還有就是自定義動畫效果.這個自定義就得靠自己的腦子編特效了.
參考共用代碼
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML><HEAD><TITLE>jquery特效處理</TITLE>
<script language="javascript" src="jquery-1.4.2.min.js"></script>
<SCRIPT language="javascript">
$(function(){
<!--www.forasp.cn jquery代碼區(qū)-->
});
</SCRIPT>
<BODY>
<div id="www" style="display:none;">網(wǎng)站制作學習網(wǎng)>
<div id="foraspcn" style="background-color: #f00;height=100;width:300;">jquery特效處理</div>
</BODY>
</HTML>
3.淡入淡出效果.
(1).fadeIn(speed,[callback]);通過不透明度的變化來實現(xiàn)所有匹配元素的淡入效果，并在動畫完成后可選地觸發(fā)一個回調(diào)函數(shù).speed跟上一節(jié)一樣有常規(guī)的"slow"0.6s,"normal"0.4s和"fast"0.2s.(下面的都一樣),元素的其他屬性不變.
jQuery實例:$("#www").fadeIn("slow");試試看,這樣"網(wǎng)站制作學習網(wǎng)",由不顯示(透明)逐漸變成顯示(不透明)(0.6s).
$("#www").fadeIn("slow",function(){alert("網(wǎng)站制作學習網(wǎng)顯示完畢")});當顯示完成后,彈出"網(wǎng)站制作學習網(wǎng)顯示完畢"對話框
(2).fadeOut(speed,[callback]);通過不透明度的變化來實現(xiàn)所有匹配元素的淡出效果，并在動畫完成后可選地觸發(fā)一個回調(diào)函數(shù),參數(shù)同上.
jQuery實例:$("#foraspcn").fadeOut(5000,function(){alert("特效fadeOut執(zhí)行完畢")}); 效果5秒,jquery特效處理層從顯示(不透明)到不顯示(透明).完畢后彈出對話框.
(3).fadeTo(speed,opacity,[callback]);把所有匹配元素的不透明度以漸進方式調(diào)整到指定的不透明度，并在動畫完成后可選地觸發(fā)一個回調(diào)函數(shù)。參數(shù)同上.opacity表示透明度從0-1;0表示透明(不顯示),1表示不透明(顯示).比如0.5也就是透明度50%.
jQuery實例:$("#foraspcn").fadeTo("slow",0.5,function(){alert("變成半透明了把!")});
4.創(chuàng)建自定義動畫
(1).animate(params, [duration], [easing], [callback]);用于創(chuàng)建自定義動畫的函數(shù)<網(wǎng)站制作學習網(wǎng)Foasp.cn>
參數(shù)介紹:
params:一組包含作為動畫屬性和終值的樣式屬性和及其值的集合 比如{height:"100px",width:"200px"}
duration:也就是上面的speed,三種預定速度之一的字符串("slow", "normal", or "fast")或表示動畫時長的毫秒數(shù)值(如：1000)可選
easing:要使用的擦除效果的名稱(需要插件支持).默認jQuery提供"linear" 和 "swing".可選
callback:回調(diào)函數(shù).可選.
在這里就舉例一個,對于easing 是需要插件支持的.目前沒有實用就不做easing例子了.
例子:
$("#foraspc").animate(
{height:"50px",width:"100px",opacity:"0.8"},
1000,
function(){alert("執(zhí)行完畢")}
);
試試看效果.
(2).stop([clearQueue], [gotoEnd])停止所有在指定元素上正在運行的動畫
$("#foraspcn").bind("click",function(){$("#www").stop();}); 當點擊第二個div時,第一個層停止動作
(3).delay(duration, [queueName]);設(shè)置一個延時來推遲執(zhí)行隊列中之后的項目duration延時時間，單位：毫秒queueName隊列名詞，默認是Fx，動畫隊列。
舉例:$("#foraspcn").slideUp(300).delay(800).fadeIn(400); 看看效果把.
5.jquery動畫設(shè)置
BooleanjQuery.fx.off關(guān)閉頁面上所有的動畫
jquery簡單的特效就講完了.
更多信息請查看IT技術(shù)專欄
公眾號
事業(yè)單位
當前位置：
公考類
招聘類
各類考試