js如何改变鼠标样式

我有一个div 我想让鼠标移动到左右两边框时鼠标形状为左右箭头 移动到上下边框时 鼠标箭头为上下箭头 请问怎么实现呀 能否给一段代码 

解决方案 »

  1.   

    设置样式cursor，网上查查上下箭头对应的dursor的值是什么，用CSS就行啦。用JS就要对DOM进行操作了
      

  2.   

    兼容IE\FF
    <html><head>
    <meta http-equiv="Content-Type" content="text/html; charset=gb2312">
    <title>test</title>
    <script>
    function changeCursor(o,e){
    e = e?e:window.event;
    var x=y=0;
    if(e.offsetX){
    x=e.offsetX;
    y=e.offsetY;
    }else{
    var pos = getPosition(o);
    x=e.layerX-pos[0];
    y=e.layerY-pos[1];
    }
    var l=3;//敏感程度
    if((x<l&&y<l)||(o.offsetWidth-x<l&&o.offsetHeight-y<l)){
    o.style.cursor='NW-resize';
    }else if((x<l&&o.offsetHeight-y<l)||(o.offsetWidth-x<l&&y<l)){
    o.style.cursor='NE-resize';
    }else if(x<l||o.offsetWidth-x<l){
    o.style.cursor='E-resize';
    }else if(y<l||o.offsetHeight-y<l){
    o.style.cursor='N-resize';
    }else{
    o.style.cursor='';
    }
    }function getPosition(o){
    var x=y=0;
    do{
    x+=o.offsetLeft;
    y+=o.offsetTop;
    o=o.parentNode;
    }while(o.tagName!='BODY');
    return [x,y];
    }
    </script>
    </head><body>
    <div style="background-color:red;width:100px;height:100px" onmousemove="changeCursor(this,event)"></div>
    </body></html>
      

  3.   

    cursor属性，如cursor:pointer(或hand)是小手，更多请查看手册相关属性