jquery__效果(基本效果)

[quote][/quote][list]
[*]
[/list][size=medium][/size][b]一、jQuery___效果(基本效果)
show()
概述
显示隐藏的匹配元素。
这个就是 'show( speed, [callback] )' 无动画的版本。如果选择的元素是可见的,这个方法将不会改变任何东西。无论这个元素是通过hide()方法隐藏的还是在CSS里设置了display:none;,这个方法都将有效。
示例
描述:
显示所有段落
HTML 代码:
<p style="display: none">Hello</p>
jQuery 代码:
$("p").show()



show(speed, [callback])
概述
以优雅的动画显示所有匹配的元素,并在显示完成后可选地触发一个回调函数。
可以根据指定的速度动态地改变每个匹配元素的高度、宽度和不透明度。在jQuery 1.3中,padding和margin也会有动画,效果更流畅。
参数
speedString,Number
三种预定速度之一的字符串("slow", "normal", or "fast")或表示动画时长的毫秒数值(如:1000)
callback (可选)Function
在动画完成时执行的函数,每个元素执行一次。
示例
描述:
用缓慢的动画将隐藏的段落显示出来,历时600毫秒。
HTML 代码:
<p style="display: none">Hello</p>
jQuery 代码:
$("p").show("slow");
描述:
用迅速的动画将隐藏的段落显示出来,历时200毫秒。并在之后执行反馈!
HTML 代码:
<p style="display: none">Hello</p>
jQuery 代码:
$("p").show("fast",function(){
$(this).text("Animation Done!");
});
描述:
将隐藏的段落用将近4秒的时间显示出来。。。并在之后执行一个反馈。。。
HTML 代码:
<p style="display: none">Hello</p>
jQuery 代码:
$("p").show(4000,function(){
$(this).text("Animation Done...");
});


hide()
概述
隐藏显示的元素
这个就是 'hide( speed, [callback] )' 的无动画版。如果选择的元素是隐藏的,这个方法将不会改变任何东西。
示例
描述:
隐藏所有段落
jQuery 代码:
$("p").hide()


hide(speed, [callback])
概述
以优雅的动画隐藏所有匹配的元素,并在显示完成后可选地触发一个回调函数。
可以根据指定的速度动态地改变每个匹配元素的高度、宽度和不透明度。在jQuery 1.3中,padding和margin也会有动画,效果更流畅。
参数
speedString,Number
三种预定速度之一的字符串("slow", "normal", or "fast")或表示动画时长的毫秒数值(如:1000)
callback (可选)Function
在动画完成时执行的函数,每个元素执行一次。
示例
描述:
用600毫秒的时间将段落缓慢的隐藏
jQuery 代码:
$("p").hide("slow");
描述:
用200毫秒将段落迅速隐藏,之后弹出一个对话框。
jQuery 代码:
$("p").hide("fast",function(){
alert("Animation Done.");
});


toggle()
概述
切换元素的可见状态。
如果元素是可见的,切换为隐藏的;如果元素是隐藏的,切换为可见的。
示例
描述:
切换所有段落的可见状态。
HTML 代码:
<p>Hello</p><p style="display: none">Hello Again</p>
jQuery 代码:
$("p").toggle()
结果:
<p tyle="display: none">Hello</p><p style="display: block">Hello Again</p>


toggle(switch)
概述
根据switch参数切换元素的可见状态(ture为可见,false为隐藏)。
如果switch设为true,则调用show()方法来显示匹配的元素,如果switch设为false则调用hide()来隐藏元素。
参数
switchBoolean
用于确定显示/隐藏的开关
示例
描述:
切换所有段落的可见状态。
HTML 代码:
<p>Hello</p><p style="display: none">Hello Again</p>
jQuery 代码:
var flip = 0;
$("button").click(function () {
$("p").toggle( flip++ % 2 == 0 );
});
结果:
<p tyle="display: none">Hello</p><p style="display: block">Hello Again</p>


返回值:jQuerytoggle(speed, [callback])
概述
以优雅的动画切换所有匹配的元素,并在显示完成后可选地触发一个回调函数。
可以根据指定的速度动态地改变每个匹配元素的高度、宽度和不透明度。在jQuery 1.3中,padding和margin也会有动画,效果更流畅。
参数
speedString,Number
三种预定速度之一的字符串("slow", "normal", or "fast")或表示动画时长的毫秒数值(如:1000)
callback (可选)Function
在动画完成时执行的函数,每个元素执行一次。
示例
描述:
用600毫秒的时间将段落缓慢的切换显示状态
jQuery 代码:
$("p").toggle("slow");
描述:
用200毫秒将段落迅速切换显示状态,之后弹出一个对话框。
jQuery 代码:
$("p").toggle("fast",function(){
alert("Animation Done.");
});[/b]
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值