jQuery特效和动画

/* 特效 */
$(document).ready(function(){
$("#input_id2").click(function(){
/*层的隐藏特效*/
$("#div_id1").hide(500,function(){});

/* 层的显示 */
$("#div_id1").show(1000,function(){});

/* 层的交替显示隐藏 normal, slow , fast*/
$("#div_id1").toggle("normal",function(){});

/* 向上收缩 */
$("#div_id1").slideUp(1000,function(){});

/* 向下展开 */
$("#div_id1").slideDown(1000,function(){});

/* 交替向上向下展示 */
$("#div_id1").slideToggle(1000,function(){});

/* 淡入效果 */
$("#div_id1").fadeIn(2000,function(){});

/* 淡出效果 */
$("#div_id1").fadeOut(2000,function(){});

/* 淡出到某个透明度效果 */
$("#div_id1").fadeTo(2000,0.5);
});
});

/* 动画*/
$(document).ready(function(){
$("#input_id11").click(function(){
/* 动画-改编字体样式 */
$("#div_id1").animate({width: "70%",height: "100%",fontSize: "4em"},1000);

/* 用动画-实现层的显示隐藏 */
$("#div_id1").animate({height:'toggle',opacity:'toggle'},"slow");
});
});

/* 队列动画 -- 函数中包含了3个动画，逐步进行，共花费3000毫秒事件*/
$(document).ready(function(){
$("#input_id11").click(function(){
$("#div_id1").animate({width: "70%"},1000)
.animate({height: "100%"},1000)
.animate({fontSize: "4em"},1000);
});
});

/* 非队列动画 -- 函数中包含了3个动画，一起进行，共花费1000毫秒事件*/
$(document).ready(function(){
$("#input_id11").click(function(){
$("#div_id1").animate({width: "70%"},{quene:false,duration:1000})
.animate({height: "100%"},{quene:false,duration:1000})
.animate({fontSize: "4em"},{quene:false,duration:1000});
});
});