div直线移动应用html,HTML页面DIV移动 – 适合各种浏览器

在IE浏览器中，要想移动DIV有很多方式，通过DIV的各种属性，使用JavaScript即可。但是，在其他浏览器中也要完成这个效果，那么IE这套方法不一定能搞定了。所以，今天告诉大家一个方法和例子，能在IE，Opera，FireFox，Chrome，Safari下都能实现移动。

原理很简单，我们过去使用的移动的思路是，相对某一个div或窗体移动，使用marginTop和marginLeft属性。但是，这两个属性在IE以外的浏览器，不好用。此时我们使用left和top完成，并且是移动的相对点是浏览器窗口。这个可以多个DIV相对的，前后层的移动。他的活动范围是整个显示窗口。

在浏览器IE，Opera，Safari，Chrome，FireFox下都测试通过。

1、首先建立一个DIV

2、添加样式

代码：

#move{

position:relative;

left:100px;

top:100px;

width:200px;

height:200px;

border:1pxsolid#000;

}

3、编写JavaScript代码：

function move(){

//获取移动的DIV对象

var obj = document.getElementById("move");

//设置样式定位属性，让div从当前文档流中拖出。

//这样，他属于整个活动窗体