1
<!
DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"
>
2
<
html
xmlns
="http://www.w3.org/1999/xhtml"
>
3
<
head
>
4
<
meta
http-equiv
="Content-Type"
content
="text/html; charset=utf-8"
/>
5
<
title
>
无标题文档
</
title
>
6
<
script
src
="jquery_last.js"
type
="text/javascript"
></
script
>
7
<
script
type
="text/javascript"
>
8$(document).ready( function(){});
9function hiden(){
10$("#divObj").hide();//hide()函数,实现隐藏,括号里还可以带一个时间参数(毫秒)例如hide(2000)以2000毫秒的速度隐藏,还可以带slow,fast
11}
12function slideToggle(){
13$("#divObj").slideToggle(2000);//窗帘效果的切换,点一下收,点一下开,参数可以无,参数说明同上
14}
15function show(){
16$("#divObj").show();//显示,参数说明同上
17}
18function toggle(){
19$("#divObj").toggle(2000);//显示隐藏切换,参数可以无,参数说明同上
20
21}
22function slide(){
23$("#divObj").slideDown();//窗帘效果展开
24}
25
26
</
script
>
27
</
head
>
28
29
<
body
>
30
<
h3
>
div里内容的显示隐藏特效
</
h3
>
31
<
input
type
="button"
value
="隐藏"
onclick
="hiden()"
/>
32
<
input
type
="button"
value
="显示"
onclick
="show()"
/>
33
<
input
type
="button"
value
="窗帘效果显示2"
onclick
="slide()"
/>
34
<
input
type
="button"
value
="窗帘效果的切换"
onclick
="slideToggle()"
/>
35
<
input
type
="button"
value
="隐藏显示效果切换"
onclick
="toggle()"
/>
36
<
div
id
="divObj"
style
="display:none"
>
37
1.测试例子
<
br
/>
38
2.测试例子
<
br
/>
39
3.测试例子
<
br
/>
40
4.测试例子
<
br
/>
41
5.测试例子
<
br
/>
42
6.测试例子
<
br
/>
43
7.测试例子
<
br
/>
44
8.测试例子
<
br
/>
45
9.测试例子
<
br
/>
46
0.测试例子
<
br
/>
47
</
div
>
48
</
body
>
49
</
html
>
转载于:https://www.cnblogs.com/zhangchenliang/archive/2011/06/28/2092570.html