2009-09-06 8 views
2

jquery-1.2.6.js 및 jquery.panFullSize.js 두 js 파일을 확대/축소 및 팬 이미지에 사용하고 있습니다. 여기 jquery 줌 및 팬

내 HTML, 여기
<a href="#" id="zoom">Zoom< /a> 

<img src="testimage.jpg" alt="finnish winter" width="600" border="0" 
    usemap="#mypicMap" id="mypic" style="border: medium solid black" /> 

내 자바 스크립트입니다

$("img#mypic").panFullSize(700, 450).css("border", "medium solid black"); 
$("a#zoom").toggle(function(){ 
     $("img#mypic").normalView(); 
    }, 
    function(){ 
     $("img#mypic").panFullSize(); 
    } 
); 

내가 이미지를 클릭하면 내가 노력하고 있어요 (< 200 마이크로 초를 mousedown)가 확대됩니다 /입니다 확대/축소 하이퍼 링크로 작동 (전환)합니다. 그리고 드래그하면 (mousedown> 200 microsecond) 이미지가 팬으로 작동합니다.

답변

2

플러그인처럼 보입니다. panFullSize는 이미지 앞에 팬이 붙어있는 이미지의 ID를 가진 div를 만듭니다. 따라서 다음과 같이 할 수 있습니다.

$('#panmypic').mousedown(function(){ 
     $(this).bind('mouseup',function(){ 
      $("img#mypic").normalView(); 
     }) 
     .bind('mousemove',function(e){ 
      $(this).unbind('mouseup'); 
     }); 
    }); 
    $("img#mypic").click(function(){ 
      $("img#mypic").panFullSize(); 
    }); 
관련 문제