如何设置Jquery panzoom默认缩放?

时间:2016-05-19 06:34:22

标签: jquery jquery-plugins jquery.panzoom

Plugin Link

我想设置它的defualt zoom我需要什么 enter image description here

请告诉我如何更改此默认缩放值,我无法使用此插件API找到?请帮忙 ?感谢

这是我的HTML

<section id="focal1">
<div id="dd2">

<div class="buttons1">
        <button id="zoominbtn1" class="zoom-in-1">+</button>
        <button id="zoomoutbtn1" class="zoom-out-1">-</button>
        <input type="range" class="zoom-range-1" style="position: absolute; margin-top: 2px; background-color: cornsilk;">
        <button id="restbtn1" class="reset-1" style="margin-left: 254px;">Default Zoom</button>
      </div> 
      <div class="parent1" >
        <div class="panzoom1">
<div id="belowpart">    

<img src="" usemap='#searchplot' class='searchplot_css' title='searchplot' alt='searchplot' id='img-searchplot' />
<map id='searchplot' name='searchplot'>

</map>

</div>
</div>
</div>
</div>
    </section>

这是panzoom功能 JS:

(function() {
        var $section = $('#focal1').first();
        $section.find('.panzoom1').panzoom({
          $zoomIn: $section.find(".zoom-in-1"),
          $zoomOut: $section.find(".zoom-out-1"),
          $zoomRange: $section.find(".zoom-range-1"),
          $reset: $section.find(".reset-1")

        });
      })();

enter image description here 我在初始化后立即调用zoom()或者在选项中设置startTransform的值? 我想要默认值为零,当加载图像也应该缩小如何做到这一点?

2 个答案:

答案 0 :(得分:1)

初始化后立即调用take(2, 2100L, TimeUnit.MILLISECONDS)

onCompleted

或者在选项

中设置zoom()的值
$elem.panzoom("zoom", 1.1, {silent: true})  // +10%

(来自此问题:https://github.com/timmywil/jquery.panzoom/issues/218

编辑:

startTransform

答案 1 :(得分:1)

像这样更改你的功能

(function() {
        var $section = $('#focal1').first();
        $section.find('.panzoom1').panzoom({
          $zoomIn: $section.find(".zoom-in-1"),
          $zoomOut: $section.find(".zoom-out-1"),
          $zoomRange: $section.find(".zoom-range-1"),
          $reset: $section.find(".reset-1"),
          startTransform: "scale(1.1)"

        });
      })();