28、鼠标随移动的方向而改变

28、鼠标随移动的方向而改变

<html xmlns:v="urn:schemas-microsoft-com:vml" xmlns:o="urn:schemas-microsoft-com:office:office" xmlns="http://www.w3.org/TR/REC-html40">

 

<head>

<STYLE>

body{margin:0px;cursor:url(sto/Select.cur)}

v\:* { Behavior: url(#default#VML) }

</STYLE>

 

    <script>

     var trace=""

     var vP

     var r=0

     var vS

     var p=new Object()

     var lineColor=[[255,0,0],[255,0,255]]

     p.x=0;p.y=0

     function init(){

            document.body.onmousedown=function(){

              if (event.button==1 || event.button==4){

               if (event.button==1) vP=document.createElement("v:PolyLine"); else vP=document.createElement("v:line");

              }

              vS=document.createElement("v:stroke")

              vP.filled="false"

              vP.appendChild(vS)

              document.body.appendChild(vP)

              trace="";

              if (event.button==4) vP.from.value=event.clientX + "," + event.clientY;

            }

           

            document.body.onmousemove=function(){

              if (event.button==1){

              pos=event.clientX + "," + event.clientY + " ";

              trace+=pos

              vS.color="rgb(255,0,0)"

                 vP.points.value=trace

             }

             if  (event.button==4) {

              vP.to.value=event.clientX + "," + event.clientY;

             }

            

             rImg.style.left=event.clientX-20;

             rImg.style.top=event.clientY-20;

            

             var cX = p.x-event.clientX;

             var cY = p.y-event.clientY;

             if (cX || cY) {

                                   status ="cX:"+cX+" -cY:"+cY

                       rotationImg(180-parseInt(Math.atan2(cY,cX)*180/Math.PI,10));

             } 

                    p.x=event.clientX;

                    p.y=event.clientY;     

            }

    

            document.body.onmouseup=function(){

                     vS.EndArrow="Block"

             }

            document.onselectstart=function(){return false}

     }

    

     function rotationImg(flag){

          window.status=r + " to " + flag;

          var step=3;

               while(r-flag>180) flag+=360

               while(flag-r>180) flag-=360

               r += (flag-r)/step

     rImg.style.rotation=90-r;

    }

    </script>

<link rel="File-List" href="new_page_1.files/filelist.xml">

<!--[if gte mso 9]>

<xml><o:shapedefaults v:ext="edit" spidmax="1027"/>

</xml><![endif]-->

</head>

 

<body onload="init()">

<p><!--[if gte vml 1]><v:shapetype id="_x0000_t75"

 coordsize="21600,21600" o:spt="75" o:preferrelative="t" path="m@4@5l@4@11@9@11@9@5xe"

 filled="f" stroked="f">

 <v:stroke joinstyle="miter"/>

 <v:formulas>

  <v:f eqn="if lineDrawn pixelLineWidth 0"/>

  <v:f eqn="sum @0 1 0"/>

  <v:f eqn="sum 0 0 @1"/>

  <v:f eqn="prod @2 1 2"/>

  <v:f eqn="prod @3 21600 pixelWidth"/>

  <v:f eqn="prod @3 21600 pixelHeight"/>

  <v:f eqn="sum @0 0 1"/>

  <v:f eqn="prod @6 1 2"/>

  <v:f eqn="prod @7 21600 pixelWidth"/>

  <v:f eqn="sum @8 21600 0"/>

  <v:f eqn="prod @7 21600 pixelHeight"/>

  <v:f eqn="sum @10 21600 0"/>

 </v:formulas>

 <v:path o:extrusionok="f" gradientshapeok="t" o:connecttype="rect"/>

 <o:lock v:ext="edit" aspectratio="t"/>

</v:shapetype><v:shape id="rImg" o:spid="_x0000_s1025" type="#_x0000_t75"

 style='position:absolute;left:0;top:0;width:27.75pt;height:27.75pt;z-index:0'>

 <v:imagedata src="sto/mouse.gif"/>

</v:shape><![endif]--><![if !vml]><span style='mso-ignore:vglayout;position:

absolute;z-index:0;left:0px;top:0px;width:37px;height:37px'><img width=37

height=37 src="sto/mouse.gif" v:shapes="rImg"></span><![endif]></p>

</body>

 

Write a comment

Comments: 1
  • #1

    Juicer Review (Sunday, 14 April 2013 10:34)

    I shared this upon Myspace! My buddies will really enjoy it!