提示：您可以先修改部分代碼再運行
<!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=utf-8" /><title>原生javascript效果：簡單拖拽 </title><style type="text/css">#con {width:200px; height:100px; padding:10px; position:absolute; background:#333; color:#fff;}/* YUI reset */* {margin:0; padding:0;}/* body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td { margin:0;padding:0;} */table {border-collapse:collapse;border-spacing:0;}fieldset,img { border:0;}address,caption,cite,code,dfn,em,strong,th,var {font-style:normal;font-weight:normal;}ol,ul,li {list-style:none;}caption,th {text-align:left;}h1,h2,h3,h4,h5,h6 {font-size:100%;font-weight:normal;}q:before,q:after {content:'';}abbr,acronym { border:0;}/* my */.clearfix:after {content: "."; display: block; height: 0; clear: both; visibility: hidden;}.clearfix {*zoom:1;}body {color:#333; font-size:12px; font-family:Verdana,Arial,Helvetica,sans-serif;}a {text-decoration:none; color:#333;}a:hover {text-decoration:underline;}.wrapper {width:600px; margin:0 auto; padding-bottom:50px;}.ad {width:468px; margin:10px auto 0;}.ad li {padding-top:5px;}h1 {height:50px; line-height:50px; font-size:22px; font-weight:normal; font-family:"Microsoft YaHei",SimHei;}.download {display:inline-block; height:34px; line-height:34px; padding:0 10px; background:#333; font-size:14px; font-weight:bold; text-align:center; color:#fff; border:1px solid #999; margin-top:10px;}.fenxiang {height:16px; padding:20px 0 10px; margin-bottom:10px;}.shuoming {margin-top:20px; border:1px solid #ccc; padding-bottom:10px;}.shuoming dt {height:30px; line-height:30px; font-weight:bold; text-indent:10px;}.shuoming dd {line-height:20px; padding:5px 20px;}.shuoming dd a {text-decoration:underline;}.tongji {display:none;}</style><script type="text/javascript">window.onload=function () {var oCon = document.getElementById("con");var disX = 0;var disY = 0;oCon.onmousedown = function (ev) {var oEvent = ev || event;disX = oEvent.clientX - oCon.offsetLeft;disY = oEvent.clientY - oCon.offsetTop;document.onmousemove = function (ev) {var oEvent = ev || event;var l = oEvent.clientX - disX;var t = oEvent.clientY - disY;if (l<0) {l = 0;} else if (l>document.documentElement.clientWidth - oCon.offsetWidth) {l = document.documentElement.clientWidth - oCon.offsetWidth;}if (t<0) {t = 0;}else if (t>document.documentElement.clientHeight - oCon.offsetHeight) {t = document.documentElement.clientHeight - oCon.offsetHeight;}oCon.style.left = l +'px';oCon.style.top = t +'px';};document.onmouseup = function () {document.onmousemove = null;document.onmouseup = null;}return false;};};</script></head><body><div class="wrapper"><h1>原生javascript效果：簡單拖拽</h1><div id="con">mming 簡單拖拽樣本</div></div><!-- wrapper end --></body></html></td> </tr></table>
提示：您可以先修改部分代碼再運行
