HTML 层（DIV） 随鼠标事件移动？

<div class="drag" rel="drag" id="drag1" style="left:30pxtop:10px" onmousedown="dargit(this,event)">

<div class="da" ><span class="x">x</span>拖动区1.</div>

文字1

</div>

<script type="text/javascript">

var ey=0,ex=0,lx=0,ly=0,canDrg=false,thiso=null//

var x, y,rw,rh

var divs=document.getElementsByTagName("div")

for (var i=0i<divs.lengthi++){

if(divs[i].getAttribute("rel")=="drag"){

divs[i].onmousemove=function(){

thismove(this)//实时得到当前对象与鼠标的值以判断拖动及关闭区域

}

}

}

function thismove(o){

rw=parseInt(x)-parseInt(o.style.left)

rh=parseInt(y)-parseInt(o.style.top)

document.title=rw+"=文本区域="+rh

if(rh<=20 &&rw>=180)document.title=rw+"||20*20||"+rh//右上角20*20的关闭区域

if(rh<=20 &&rw<180 )document.title=rw+"||可选||"+rh//绝对拖动条选择区域

}

function dargit(o,e){

thiso = o

canDrg = true

if(!document.all){

lx = e.clientXly = e.clientY

}else{

lx = event.xly = event.y

}

if(document.all) thiso.setCapture()

st(o)//置前或置后

}

document.onmousemove = function(e){

if(!document.all){ x = e.clientXy = e.clientY}else{ x = event.xy = event.y}

if(canDrg){

//if(rh<=20 &&rw<180 ){//如果要设定拖动区域可以作判断

var ofsx = x - lx

thiso.style.left = parseInt(thiso.style.left) + ofsx

lx = x

var ofsy = y - ly

thiso.style.top = parseInt(thiso.style.top) + ofsy

ly = y

//}else{canDrg=false}

}

}

document.onmouseup=function(){

canDrg=false//拖拽变量设为false

if(document.all &&thiso != null){

//ie下，将清捕获

thiso.releaseCapture()

thiso = null

}

}

function set(obj){

obj=obj.parentNode.parentNode

if(obj.getAttribute("rel"))

//obj.style.zIndex=1

}

function st(o){

var p = o.parentNode

if(p.lastChild != o){

p.appendChild(o)

}

if(rh<=20 &&rw>=180){

canDrg=false

window.status=rw+"|"+rh

if(p.firstChild == o) return

p.insertBefore(o, p.firstChild)

}

}

</script>

我自己编了一个程序，有2个文件，我先说一下思路

用线程编程

监听鼠标移动事件，用线程不断获取鼠标坐标

根据鼠标坐标和眼球坐标来画出眼球的位置

package s0124随鼠标动眼睛

//最初编写出问题的原因是没有明白把要做的事情放到run方法里面

import java.awt.BorderLayout

import java.awt.Graphics

import java.awt.event.MouseEvent

import java.awt.event.MouseListener

import java.awt.event.MouseMotionListener

import javax.swing.ImageIcon

import javax.swing.JFrame

import javax.swing.JPanel

public class Main extends JFrame{

   static int xx

    static int yy

    JPanel drawpanel

    Graphics g

    

public static void main(String[] args) {

Main a=new Main()

}

    

public Main()

{

this.setTitle("随着鼠标动眼睛")

this.setSize(500,500)

this.setLocationRelativeTo(null)       //设置窗体出现位置居中  

    this.setDefaultCloseOperation(3)      //设置窗体的关闭 *** 作

    this.setResizable(false)                      //设置禁止调整窗体的大小                              

    this.setLayout(new BorderLayout())            //设置为边框布局

    drawpanel=new JPanel()                        //新建一个画图面板

    this.add(drawpanel,BorderLayout.CENTER)       //将画图面板添加到窗体的中间位置     

    this.setVisible(true)                         //设置窗体可见

    g=drawpanel.getGraphics()                     //得到画图面板的画笔，为了传递给监听器listener

    

    MyThread mt=new MyThread(g,drawpanel)         //新建一个监听器，并把参数传递进去

    drawpanel.addMouseMotionListener(mt)          //为画图面板添加监听对象

    Thread r=new Thread(mt)                     

r.start()                                //启动线程

}

}

package s0124随鼠标动眼睛

import java.awt.Graphics

import java.awt.event.MouseEvent

import java.awt.event.MouseMotionListener

import javax.swing.JPanel

import javax.swing.plaf.SliderUI

public class MyThread implements Runnable,MouseMotionListener{

int x

int y

Graphics g

JPanel drawpanel

public MyThread(Graphics g,JPanel drawpanel)

{

this.g=g

this.drawpanel=drawpanel

}

public void run()

{    

while(true)

{

try {

Thread.sleep(10)

} catch (InterruptedException e) {

e.printStackTrace()

}

g.clearRect(0, 0, 600, 600)

g.drawOval(100, 100, 100, 100) 

g.drawOval(300, 100, 100, 100) 

//画左眼球

int x1=150+(x-150)/5

int y1=150+(y-150)/5

g.fillOval(x1-15,y1-15, 30,30)

//画右眼球

int x2=350+(x-350)/5

int y2=150+(y-150)/5

g.fillOval(x2-15,y2-15, 30,30)

g.drawLine(200, 300, 250, 250)

g.drawLine(250, 250,300,300)

g.drawLine(150, 350, 350, 350)

}

}

public void mouseDragged(MouseEvent e) {

}

public void mouseMoved(MouseEvent e) {

  x=e.getX()

  y=e.getY()

}

}

---