2013-02-10 136 views
0

我的應用程序是在asp.net MVC3中,我遇到了SmoothZoom和HTML5 Canvas的問題。當我激活縮放時,畫布圖像將會消失。HTML5畫布,smoothZoom

這裏是我的代碼:

顯示圖像:

<div id="Div1" style="position: relative; width: 256px; height: 256px"> 
<img id="Image2" src="<%= ViewBag.IMG2 %>" alt="image" height="256" width="256" /> 
<canvas id="canvas6" style="z-index: 1; position: absolute; left: 0px; top: 0px;" 
height="256px" width="256px"> 
This text is displayed if your browser does not support HTML5 Canvas. 
</canvas> 
</div> 

    function drawCanvas1() { 

      canvas6 = document.getElementById("canvas6"); 
      ctx6 = canvas6.getContext("2d"); 

      ctx6.clearRect(0, 0, WIDTH1, HEIGHT1); 
      var img = new Image(); 
      img.onload = function() { 
       ctx6.drawImage(img, 200, 20); 
      } 
      img.src = "../../Content/images/l.png"; 
     } 

要激活smoothzoom:

function zoomMPR() { 
      $('#Image2').smoothZoom({ 
       width: 256, 
       height: 256, 
       zoom: 5, 
       speed: 1 
      }); 

回答