javascript层收缩效果资源-CSDN文库

共3个文件

css：1个

html：1个

js：1个

javascript层收缩效果

需积分: 9 74 浏览量 2011-04-11 09:21:09 上传评论收藏 2KB RAR 举报

资源推荐

资源详情

资源评论

收起资源包目录

toggle伸缩效果.rar （3个子文件）

css.css 495B

toggle.js 2KB

index.html 2KB

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <title>Untitled Document</title> <link type="text/css" href="css.css" rel="stylesheet"/> <script type="text/javascript" src="toggle.js"></script> <script type="text/javascript"> window.onload = function (){ var d_1 = new _toggle($.id("c_1"),"fast"); $.id("t_1").onclick = function(){ d_1.toggle(); } var d_2 = new _toggle($.id("c_2"),"slow"); $.id("t_2").onclick = function(){ d_2.toggle(); } var d_3 = new _toggle($.id("c_3"),"normal"); $.id("t_3").onclick = function(){ d_3.toggle(); } var d_4 = new _toggle($.id("c_4")); $.id("t_4").onclick = function(){ d_4.toggle(); } var d_5 = new _toggle($.id("c_5")); $.id("t_5").onclick = function(){ d_5.toggle(); } } </script> </head> <body> <div class="box"> <h2 class="title" id="t_1">草履虫(快)</h2> <div class="content" id="c_1"><ul><li>点击上面的灰色块就能伸缩</li><li>调用方法看源码window.onload</li><li>有bug联系:caolvchong@gmail.com</li></ul></div> </div> <div class="box"> <h2 class="title" id="t_2">草履虫(慢)</h2> <div class="content" id="c_2"><ul><li>1</li><li>2</li><li>3</li><li>4</li><li>5</li><li>6</li><li>7</li></ul></div> </div> <div class="box"> <h2 class="title" id="t_3">草履虫(正常速度(默认))</h2> <div class="content" id="c_3"><ul><li>1</li><li>2</li><li>3</li><li>4</li><li>5</li><li>6</li><li>7</li></ul></div> </div> <div class="box"> <h2 class="title" id="t_4">草履虫(隐藏,正常速度)</h2> <div class="content" id="c_4" style="display:none;"><ul><li>1</li><li>2</li><li>3</li><li>4</li><li>5</li><li>6</li><li>7</li></ul></div> </div> <div class="box"> <h2 id="t_5">草履虫(未知高度,正常速度)</h2> <div id="c_5"><ul><li>1</li><li>2</li><li>3</li><li>4</li><li>5</li></ul></div> </div> </body> </html>

评论收藏

内容反馈