快捷導(dǎo)航

js動(dòng)畫效果打開層關(guān)閉層

更新時(shí)間：2008年04月26日 21:53:26 作者：

js模擬彈窗效果代碼，用層實(shí)現(xiàn)提示效果代碼

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <title>DOM_text01</title> <style type="text/css"> body,span,div,td{font-size:12px;line-height:1.5em;color:#849BCA;} #bodyL{     float:left;     width:84px;     margin-right:2px; } a.od{     width:80px;     height:25px;     line-height:25px;     text-align:center;     font-weight:bold;     border: 2px solid #849BCA;         display:block;     color:#547BC9;     float:left;     text-decoration:none;     margin-top:2px; } a.od:link{     background:#EEF1F8; } a.od:visited{     background:#EEF1F8; } a.od:hover{     background:#EEE; } a.od:active{     background:#EEE; } #fd{         width:500px;     height:200px;     background:#EDF1F8;         border: 2px solid #849BCA;     margin-top:2px;     margin-left:2px;     float:left;     overflow:hidden;     position:absolute;     left:0px;     top:0px;     cursor:move;     float:left;     /*filter:alpha(opacity=50);*/      } .content{     padding:10px; } </style> </head> <body> <div   class="wppm3vysvbp"   id="bodyL">     <a href="#" class="od" onclick = "show('fd');return false;">         [打開層]     </a>     <a href="#" class="od" onclick = "closeed('fd');return false;">         [關(guān)閉層]     </a> </div>     <div   class="wppm3vysvbp"   id="fd" style="display:none;filter:alpha(opacity=100);opacity:1;">     <div   id="wppm3vysvbp"   class="content">移動(dòng)層</div>     </div>       </body> </html>

[Ctrl+A 全選注:引入外部Js需再刷新一下頁面才能執(zhí)行]

您可能感興趣的文章:

相關(guān)文章

BootStrap+Mybatis框架下實(shí)現(xiàn)表單提交數(shù)據(jù)重復(fù)驗(yàn)證
這篇文章主要介紹了BootStrap+Mybatis框架下實(shí)現(xiàn)表單提交數(shù)據(jù)重復(fù)驗(yàn)證功能,非常不錯(cuò)，具有參考借鑒價(jià)值，需要的朋友可以參考下
2017-03-03
一個(gè)用js實(shí)現(xiàn)過濾重復(fù)字符的函數(shù)
一個(gè)用js實(shí)現(xiàn)過濾重復(fù)字符的函數(shù)...
2007-08-08
window resize和scroll事件的基本優(yōu)化思路
在項(xiàng)目中使用scroll事件去加載數(shù)據(jù)，結(jié)果IE下悲劇了。下面為大家介紹下window resize和scroll事件的基本優(yōu)化思路,需要的朋友可以參考下
2014-04-04
Dojo獲取下拉框的文本和值實(shí)例代碼
這篇文章主要介紹了Dojo獲取下拉框的文本和值實(shí)例代碼的相關(guān)資料,非常不錯(cuò)，具有參考借鑒價(jià)值，需要的朋友可以參考下
2016-05-05
jQuery 實(shí)現(xiàn)倒計(jì)時(shí)天,時(shí),分,秒功能
本文通過html代碼和js代碼給大家介紹了實(shí)現(xiàn)倒計(jì)時(shí)天,時(shí),分,秒功能，非常不錯(cuò)，具有一定的參考借鑒價(jià)值，需要的朋友參考下吧
2018-07-07
.html文件防止script腳本緩存的三種方法
現(xiàn)在有這樣一個(gè)問題,由于一些原因,我們經(jīng)常需要修改gTool的代碼然后上傳更新cdn,但是用戶通過 html 文件訪問的 gTool 鏈接實(shí)際上還是緩存的,所以現(xiàn)在問題就是如何禁止緩存,文中給大家介紹了三個(gè)方法供大家參考,需要的朋友可以參考下
2024-01-01
JS+Canvas繪制動(dòng)態(tài)時(shí)鐘效果
這篇文章主要為大家詳細(xì)介紹了JS+Canvas繪制動(dòng)態(tài)時(shí)鐘效果，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
2017-11-11
使用javascript實(shí)現(xiàn)監(jiān)控視頻播放并打印日志
這篇文章主要介紹了使用javascript實(shí)現(xiàn)監(jiān)控視頻播放并打印日志的方法及示例代碼分享，非常不錯(cuò),需要的朋友可以參考下
2015-01-01
webpack學(xué)習(xí)筆記之代碼分割和按需加載的實(shí)例詳解
本篇文章主要介紹了webpack學(xué)習(xí)筆記之代碼分割和按需加載的實(shí)例詳解，具有一定的參考價(jià)值，有興趣的可以了解一下
2017-07-07
JavaScript實(shí)現(xiàn)省份城市的三級(jí)聯(lián)動(dòng)
這篇文章主要為大家詳細(xì)介紹了JavaScript實(shí)現(xiàn)省份城市的三級(jí)聯(lián)動(dòng)，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
2020-02-02