カーソルの表示方法を移動するときは？

-1

<!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"> 
     <style> 
      *{margin:0px;padding:0px} 
     </style> 
    </head> 
    <body> 
     <div id="my" style="width:200px;height:150px;background:#f1fada;"> 
      <div id="top" style="background:#f4f4f4;cursor:move">tip</div> 
      <div id="bv"> 
       this is a test 
      </div> 
     </div> 

     <script> 
      function $(o){ 
       return document.getElementById(o); 
      } 
     $("top").onmousedown=function(event){ 


       var x1=event.clientX-$("my").offsetLeft; 
       var y1=event.clientY-$("my").offsetTop; 
       var witchButton=false; 
       if(document.all&&event.button==1){witchButton=true;} 
       else{if(event.button==0)witchButton=true;} 
       if(witchButton) 
       { 
        $("top").onmousemove=function(event){ 
         $("my").style.position="absolute"; 
         $("my").style.left=event.clientX-x1+"px"; 
          $("my").style.top=event.clientY-y1+"px";  
        } 
        $("top").onmouseup=function(){ 
          $("top").onmousemove=null; 
       } 
       } 
      } 

     </script> 
    </body> 
</html>

コードは、あなたのexplororでそれを試すことができ、カーソルの表示方法を移動するときは？

権利です。

私は（テキスト型）カーソル表示が「I」で、私が移動するときにお願いしたいと思います、私は修正するために行うことができますどのように、

を移動していませんか？

出典

2012-02-23 xujinliang1227

Strange..Its：http://jsfiddle.net/qR7d9/ – Unknown

は私の答えを削除し、私は読んで申し訳ありませんあなたの質問が早すぎて、jQueryで作業していると思って、コード内の最初の関数を完全に見逃しました:) –

ブラウザのユーザー選択の動作を取り除かなければなりません。それは唯一の方法です。あなたは一時的なこのスタイルを割り当てることによって無効に選択のすべての副作用を取り除くことができます。私のために働い

<!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"> 
     <style> 
      *{margin:0px;padding:0px} 
      .no-user-select { 
       -moz-user-select: none; 
       -webkit-user-select: none; 
       -ms-user-select: none; 
       cursor:move; 
      } 
     </style> 
    </head> 
    <body> 
     <div id="my" style="width:200px;height:150px;background:#f1fada; "> 
      <div id="top" style="background:#f4f4f4;cursor:move; ">tip</div> 
      <div id="bv"> 
       this is a test 
      </div> 
     </div> 
     gdfgd 

     <script> 
      function $(o){ 
       return document.getElementById(o); 
      } 
     $("top").onmousedown=function(event){ 

       document.getElementsByTagName('body')[0].className = 'no-user-select'; 

       var x1=event.clientX-$("my").offsetLeft; 
       var y1=event.clientY-$("my").offsetTop; 
       var witchButton=false; 
       if(document.all&&event.button==1){witchButton=true;} 
       else{if(event.button==0)witchButton=true;} 
       if(witchButton) 
       { 
        $("top").onmousemove=function(event){ 
         $("my").style.position="absolute"; 
         $("my").style.left=event.clientX-x1+"px"; 
         $("my").style.top=event.clientY-y1+"px";  
        } 
        $("top").onmouseup=function(){ 
         $("top").onmousemove=null; 
         document.getElementsByTagName('body')[0].className = ''; 

       } 
       } 
      } 

     </script> 
    </body> 
</html>

出典

2012-02-23 05:36:30

あなたの体の要素宣言を更新してみてください..私は私が

$("top").onmousemove=function(event){ 

$("my").style.cursor="move"; 

... 

}

使用することを試みるが、それは効果がありません - それは表示され、テキスト選択カーソルを防ぐ必要があります。

<body style="-moz-user-select: none; -webkit-user-select: none; -ms-user-select: none;">

出典

2012-02-23 03:34:01

それは良いです、他の実行可能なメソッドはありますか？ – xujinliang1227

私の新しい答えを見てください。 –

カーソルの表示方法を移動するときは？

答えて

関連する問題