大家看看这段代码怎么修改

我做的是拉伸图片的功能，可是拉大的时候必须慢慢拉，不然就不能成功，大家看我逻辑上是哪出问题了
<html>
<head>
<script>
   var bdown = false;   function func(which)
   {
       var x = which.offsetLeft + which.width;
       var y = which.offsetTop + which.height;
       var left = x - event.clientX;
       var top = y - event.clientY;
       if(left < 5 && top < 5)
         {which.style.cursor = 'nw-resize';}
        else
        { 
              if(!bdown)
              {
                 which.style.cursor = 'Default';
              }
        }       if(which.style.cursor == 'nw-resize' && bdown)
        {
               which.width = event.clientX - which.offsetLeft;
               which.height = event.clientY - which.offsetTop;
        }
   }    function func2()
   {
       bdown = true;
   }    function func3()
   {
       bdown = false;
   }  document.onmousedown=func2;
 document.onmouseup=func3;</script>
</head>
<body>
 <img   src="C:\Documents and Settings\Markluo\My Documents\My Pictures\image.JPG"   id="imgMain"   class="imgMain"   onmousemove="func(this)">
</body>
<html>

解决方案 »

  1.   

    修改见红色部分<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
    "http://www.w3.org/TR/html4/loose.dtd">
    <html> 
    <head> 
    <script> 
      var bdown = false; 
      function func(whichID) 
      { 
          var which=document.getElementById(whichID);
          var x = which.offsetLeft + which.width; 
          var y = which.offsetTop + which.height; 
          var left = x - event.clientX; 
          var top = y - event.clientY; 
          if(left < 5 && top < 5) {
       which.style.cursor = 'nw-resize';
      }else{ 
             if(!bdown) 
               {which.style.cursor = 'Default'; }
          } 
      if(bdown) 
            { 
                  which.width = event.clientX - which.offsetLeft; 
                  which.height = event.clientY - which.offsetTop; 
            } 
      }   function func2() 
      { 
          bdown = true; 
      }   function func3() 
      { 
          bdown = false; 
      } document.onmousedown=func2; 
    document.onmouseup=func3; </script> 
    </head> 
    <body onmousemove="javascript:func('imgMain')"> 
    <img src="http://avatar.profile.csdn.net/8/3/3/2_zheyimiao.jpg"  id="imgMain"  class="imgMain"> 
    </body> 
    </html>
      

  2.   

    <html> 
    <head> 
    <script> 
      var bdown = false; 
      var bObj = null;
      function func() 
      { 
         if(bObj==null){return;}
         var which = bObj;
          var x = which.offsetLeft + which.width; 
          var y = which.offsetTop + which.height; 
          var left = x - event.clientX; 
          var top = y - event.clientY; 
          if(left < 5 && top < 5) 
            {which.style.cursor = 'nw-resize';} 
            else 
            { 
                  if(!bdown) 
                  { 
                    which.style.cursor = 'Default'; 
                  } 
            }       if(bdown) 
            { 
                  which.width = event.clientX - which.offsetLeft; 
                  which.height = event.clientY - which.offsetTop; 
            } 
      }   function func2(obj) 
      { 
          bdown = true;
          bObj = obj; 
      }   function func3() 
      { 
          bdown = false; 
          bObj = null;
      }  
      
      document.onmousemove = func;
      document.onmouseup = func3;
    </script> 
    </head> 
    <body> 
    <img  src="C:\Documents and Settings\Markluo\My Documents\My Pictures\image.JPG"  id="imgMain"  class="imgMain" onmousedown="func2(this)"> 
    <img  src="C:\Documents and Settings\Markluo\My Documents\My Pictures\image.JPG"  id="imgMain"  class="imgMain" onmousedown="func2(this)"> 
    <img  src="C:\Documents and Settings\Markluo\My Documents\My Pictures\image.JPG"  id="imgMain"  class="imgMain" onmousedown="func2(this)"> 
    </body> 
    <html>