简体   繁体   中英

Panzoom - How to disable the drag option?

In rails 4.2.2 project, I am using panzoom jquery for a html element (instead of an image), for the same page I am using annotator plugin. Now the issue is annotator is not working because I am not able to select any word in the page. Whole html is moving(dragging) because of panzoom , how can I disable 'drag' option in it?

Referred by http://www.jqueryscript.net/zoom/jQuery-Plugin-For-Panning-Zooming-Any-Elements-panzoom.html

In views,

<div class="buttons">
  <button class="zoom-in btn btn-default btn-xs">+ Zoom In</button>
  <button class="zoom-out btn btn-default btn-xs">- Zoom Out</button>
  <button class="reset btn-sm btn btn-primary">Reset</button>
</div>
<div class="panzoom" style="height: 480px;">
  <%= render :file => @path %>
</div>

$(".panzoom").panzoom({
 $zoomIn:    $(".zoom-in"),
 $zoomOut:   $(".zoom-out"),
 $zoomRange: $(".zoom-range"),
 $reset:     $(".reset")
});

Use the disablePan option :

$section.find('.panzoom').panzoom({
  disablePan: true,
  $zoomIn: $section.find(".zoom-in"),
  $zoomOut: $section.find(".zoom-out"),
  $zoomRange: $section.find(".zoom-range"),
  $reset: $section.find(".reset")
});

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM