模板無憂
網頁特效
每日更新
|
TOP排行榜
|
Tag標簽
|
充值
無憂首頁
網頁模板
程序模板
建站教程
視頻教程
網頁特效
圖標素材
字體下載
站長工具
站長問答
網頁特效
菜單導航
圖片特效
文本鏈接
層和布局
頁面背景
表單按鈕
日期時間
計算轉換
鍵盤鼠標
瀏覽器
游戲娛樂
綜合其它
常用代碼
jQuery特效
Prototype
Ajax/JavaScript
ExtJS
CSS特效
在線編輯器
Mootools
HTML
JS廣告代碼合集
站長工具
站長常用軟件
網站綜合查詢
Alexa排名查詢
Google PR查詢
域名Whois查詢
網站收錄查詢
友情鏈接查詢
CSS2中文手冊
CSS精簡優化工具
網頁特效代碼
模板無憂
>
網頁特效
>
層和布局特效代碼
>
收藏
分享
查看評論
層和布局
演示
一個DIV層的折疊與展開_層和布局特效
查看演示效果
特效Tag：
層展開
添加
一個DIV層的折疊與展開，不錯的小技巧，代碼雖然不多，但比較實用。
<html> <head> <title>展的折疊、展開</title> <style> #mrc { font-size: 14px; width: 160px; height: 50px; background: #eee; padding: 10px; border: 4px #ccc double; overflow: hidden; } #key { color: red; float: right; margin-top: -20px; } </style> <script> var s=5; var minheight=50; var maxheight=150; function shoppingcat(){ var key = document.getElementById("key").innerText; if(mrc.style.pixelHeight==0)mrc.style.pixelHeight=minheight; if(key=="展開"){ mrc.style.pixelHeight+=s; if(mrc.style.pixelHeight<maxheight){ setTimeout("shoppingcat();",1); }else{ document.getElementById("key").innerText="關閉"; } }else{ mrc.style.pixelHeight-=s; if(mrc.style.pixelHeight>minheight){ setTimeout("shoppingcat();",1); }else{ document.getElementById("key").innerText="展開"; } } } </script> </head> <body> <div id="mrc"> 模板無憂 <span id="key" onclick="shoppingcat();">展開</span><br><br> 模板無憂源碼下載。 </div> </body> </html>
所屬頻道：
層和布局特效
/
更新時間：2012-12-01
[收藏]
[報錯]
[返回列表]
相關
層和布局特效
：
表格內容排序sortTable
行變成列，列變成行
文本輸入限制
拆分單元格
控制表格內的滾動條
顏色交替的表格
JS計算里面有多少個
極酷的表格
會動的表格
可拖動單元格
變色表格
訪問表格的每個TD
層和布局特效Rss訂閱
特效代碼搜索
層和布局特效推薦
CSS+JavaScript經典版折疊、合攏的三級菜單
JS拖動改變表格列寬的實現
特殊字符實現的CSS圓角
js+css實現動態刪除表格行、列、雙擊編輯
隱藏菜單，在網頁任意處點左鍵就會彈出
文本輸入限制
CSS控制文字在一條線的中間
JS控制一個DIV層在指定時間內消失
JavaScript配合CSS實現表格顏色漸變
CSS層透明效果,兼容性很好
猜你也喜歡看這些
JS無刷新改變網頁背景圖片
JS控制網頁背景圖片斜向滾動
滾動條顏色生成器
點擊鼠標在網頁上生成氣泡
選色板
WEB對話框 可做網站登錄協議用
CSS背景漸變，從左往右漸變
JavaScript寫的炫光波動效果
避免別人把你的網頁放在框架中
Js適時切換網頁背景顏色
相關鏈接：
復制本頁鏈接
|
搜索一個DIV層的折疊與展開
特效說明：
層和布局模板
-
一個DIV層的折疊與展開
。
。。