html弹出提示框并实现拖动的源码

简单的测试页面<!--html {height: 100%;}body {margin: 0px;padding: 0px;height: 100%;}#dt_3 {cursor: pointer;}div#mbDIV {position: absolute;top: 0px;left: 0px;width:

yyydeyangzi

1750人浏览 · 2010-05-19 20:41:00

yyydeyangzi · 2010-05-19 20:41:00 发布

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta content="text/html; charset=gb2312" http-equiv="Content-Type" /> <title>简单的测试页面</title> <mce:style type="text/css"></mce:style><style type="text/css" mce_bogus="1">html { height: 100%; } body { margin: 0px; padding: 0px; height: 100%; } #dt_3 { cursor: pointer; } div#mbDIV { position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; background-color: #000; z-index: 10; filter: alpha(opacity=50); opacity: 0.5; } div#loginDIV { position: absolute; width: 300px; height: 150px; background-color: #FFFF00; z-index: 20; } div#loginTopDIV { width: 100%; height: 20px; background-color: #FF0000; cursor: move; }</style> <mce:script type="text/javascript"></mce:script> </head> <body> <div style="overflow: hidden;" mce_style="overflow: hidden;"> <h3>请点击 --> 03号拖拉机</h3> <p id="dt_1">01号拖拉机</p> <p id="dt_2">02号拖拉机</p> <p id="dt_3">03号拖拉机</p> <p id="dt_4">04号拖拉机</p> <p id="dt_5">05号拖拉机</p> <p id="dt_6">06号拖拉机</p> <p id="dt_7">07号拖拉机</p> <p id="dt_8">08号拖拉机</p> <p id="dt_9">09号拖拉机</p> <p id="dt_10">10号拖拉机</p> <p id="dt_11">11号拖拉机</p> </div> <div id="mbDIV" style="display: none;" mce_style="display: none;"> </div> <div id="loginDIV" style="top: 130px; left: 304px;display: "";"> <div id="loginTopDIV"> Move</div> <p style="text-align: center;" mce_style="text-align: center;">登陆内容在这里哦</p> <form action="#" method="get" style="text-align: center;" mce_style="text-align: center;"> <input id="button_1" type="button" value="确定" /> <input id="button_2" type="button" value="取消" /> </form> </div> <mce:script type="text/javascript"></mce:script> </body> </html>