jquery panzoom的持續時間

有沒有人能夠獲得panzoom的持續時間功能？ https://github.com/timmywil/jquery.panzoom jquery panzoom的持續時間

我進入源代碼並將持續時間從200增加到1200，並且在調用縮放時沒有看到變化。

$panzoom.panzoom("zoom", 2.5);

更新

  var $section = $('section').first(); 
     $panzoom = $section.find('.panzoom').panzoom({ 
      contain: false, 
      minScale: 1, 
      maxScale: 3, 
      contain: true, 
      duration:1200 
      }).panzoom('zoom', true); 


$(elm).on('click' function(){ 

$panzoom.panzoom("zoom", true); 
});

來源

2016-03-06 user2524908

爲什麼不直接使用選項（）方法改變呢？從panzoom docs:

// One at a time 
// Sets the scale increment option 
$elem.panzoom("option", "duration", 1200); 

// Several options at once 
$elem.panzoom("option", { 
    increment: 0.4, 
    minScale: 0.1, 
    maxScale: 2, 
    duration: 500, 
    $reset: $("a.reset-panzoom, button.reset-panzoom") 
});

你不應該改變任何違約源設置不同的時間。

編輯：

你需要給「放大」的真實設置選項自己持續時間布爾屬性，如文檔中提到：

「如果該方法傳遞一個布爾值，真將根據選項中指定的增量指示執行縮小，如果爲false（或省略），則將執行放大。「

下面就是我給自己定的選項自定義的持續時間（2500）和使用的panzoom（「縮放」，真）工作版本：

<html> 
 
    <head> 
 
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script> 
 
<script src="http://timmywil.github.io/jquery.panzoom/dist/jquery.panzoom.js"></script> 
 
    </head> 
 
    <body> 
 
    <section id="contain"> 
 
     <h1>Containment within the parent element</h1> 
 
     <div class="panzoom-parent" style="overflow: hidden; position: relative;"> 
 
     <img class="panzoom" src="http://blog.millermedeiros.com/wp-content/uploads/2010/04/awesome_tiger.svg" width="900" height="900" style="transform: matrix(0.9, 0, 0, 0.9, -46, 44); backface-visibility: hidden; transform-origin: 50% 50% 0px; cursor: move; transition: transform 200ms ease-in-out;"> 
 
     </div> 
 
     
 
     <div class="buttons"> 
 
     <button class="zoom-in">Zoom In</button> 
 
     <button class="zoom-out">Zoom Out</button> 
 
     <input type="range" class="zoom-range" step="0.05" min="0.4" max="0.9"> 
 
     <button class="reset">Reset</button> 
 
     </div> 
 
     <script> 
 
     (function() { 
 
      var $section = $('#contain'); 
 
      var $panzoom = $section.find('.panzoom').panzoom({ 
 
      $zoomIn: $section.find(".zoom-in"), 
 
      $zoomOut: $section.find(".zoom-out"), 
 
      $zoomRange: $section.find(".zoom-range"), 
 
      $reset: $section.find(".reset"), 
 
      startTransform: 'scale(0.9)', 
 
      maxScale: 0.9, 
 
      increment: 0.1, 
 
      contain: true, 
 
      duration:2500 
 
      }).panzoom('zoom', true); 
 
     })(); 
 
     </script> 
 
    </section> 
 
    </body> 
 
</html>

來源

2016-03-06 23:49:10

它不工作。當我設置持續時間時，它不會改變縮放時間。 – user2524908

我已經更新了答案，您需要使用boolean true作爲參數來「縮放」以使用options（）中設置的持續時間。 –

感謝您解決這個問題。當您調用元素的縮放時，您能傳遞真實的值嗎？ $ panzoom.panzoom（「zoom」，2.5，true）; – user2524908

jquery panzoom的持續時間

回答

相關問題