CSS教程之javascript完成能够拖动的层示例(层拖动，兼容IE/FF)
现在我们不再使用之前所学的“table”定位技术，而是采用Div+css的方式实现各种定位。[*]
[*]
<!DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><htmlxmlns="http://www.w3.org/1999/xhtml"><head><styletype="text/css">#maindiv{position:absolute;width:220px;height:150px;border:1pxsolid#999;}</style><scripttype="text/javascript">vara;document.onmouseup=function(){if(!a)return;document.all?a.releaseCapture():window.captureEvents(Event.MOUSEMOVE|Event.MOUSEUP);a="";};document.onmousemove=function(d){if(!a)return;if(!d)d=event;a.style.left=(d.clientX-b)+"px";a.style.top=(d.clientY-c)+"px";};function$(o,e){a=o;document.all?a.setCapture():window.captureEvents(Event.MOUSEMOVE);b=e.clientX-parseInt(a.style.left);c=e.clientY-parseInt(a.style.top);}</script></head><body><divid="main"><divstyle="left:100px;top:100px;background:#fc9;"onmousedown="$(this,event)">1</div><divstyle="left:400px;top:100px;background:#9cf;"onmousedown="$(this,event)">2</div><divstyle="left:700px;top:100px;background:#f9c;"onmousedown="$(this,event)">3</div><divstyle="left:100px;top:300px;background:#9fc;"onmousedown="$(this,event)">4</div><divstyle="left:400px;top:300px;background:#c9f;"onmousedown="$(this,event)">5</div><divstyle="left:700px;top:300px;background:#cf9;"onmousedown="$(this,event)">6</div></div></body></html>
尺度之路www.ckuyun.com提醒：能够先修正部分代码后再运转
dreamweaver只是充当一个文本编辑器的角色，而你所有的工作基本都在代码视图中完成，在这里我推荐adobe最新的dreamweavercs4。当然如果CS5出现了我也会去试用它。 技术的学习如同长跑。只要越过极限，就会越跑越轻松。技术的学习其实并不像想象中那么可怕，任何技术都并不高深莫测。 还可以在Dreamweaver常用工具中选择超级链接，完成相应的填写即可。 dreamweaver8中文版下载(dw)对专业网页图像设计的FIREWORKS，三者被MACROMEDIA公司称为DREAMTEAM(梦之队)。 俗话说：兴趣是最好的老师。做每一件事都离不开兴趣的驱动。兴趣是自学技术需要迈出的第一步。在学习的过程中，我们难免会遇到各种各样的问题。 技术的学习如同长跑。只要越过极限，就会越跑越轻松。技术的学习其实并不像想象中那么可怕，任何技术都并不高深莫测。 学Dreamweaver技术的过程其实是一个增加信心的过程。 只要我们努力，无论是怎样的艰难险阻，成功依然会迎面直击。在刚开始时我觉得dreamweaver mx XX很难理解。 Dreamweaver是唯一提供Roundtrip HTML、视觉化编辑与原始码编辑同步的设计工具。它包含HomeSite和BBEdit等主流文字编辑器。
页:
[1]