jQuery 效果 - 出现/消失
fadeIn()/ fadeOut()/fadeToggle() (淡入淡出效果)
语法:
$(selector).fadeTo(speed,callback);//speed可取值:"slow"、"fast" 或毫秒。
$(selector).fadeTo(speed,opacity,callback);//fadeToggle()有透明度属性(值介于 0 与 1 之间)
案例
$(document).ready(function(){
$("button").click(function(){
$("#div1").fadeIn();
$("#div2").fadeIn("slow");
$("#div3").fadeIn(3000);
});
});
fadeIn( ),fadeOut( )会让div块容积消失;
$(document).ready(function)(){
$("button").click(function(){
$("#div1").fadeTo("slow",0.15);
$("#div2").fadeTo("slow",0.4);
});
});
fadeToggl()置透明度值后,块的容积依然存在,只是透明度改变。
hide()/show()
语法:
$(selector).toggle(speed,callback);
案例
$(document).ready(function(){
$("p").click(function(){
$("#hide").hide();
$("#show").show("fast");
$("#toggle").toggle(600)
});
});
如果设置了速度是毫秒值,被事件激发的块:
块(有宽、高值且不是100%,没有定位)——默认从左上角开始出现/从右下角开始隐藏;
块(有宽、高值且不是100%,有定位)——定位的坐标点开始出现/从反向位置隐藏;
块(有高值,宽是100%)——默认从上开始出现/从下开始隐藏;
slideDown()/slideUp()/slideToggle() (滑动效果)
用法同上,但是只有上下的方向。