mouse_hover_pinch_zoom
Version:
a Javascript library providing touch gestures for zooming and dragging on image elements on mobile And mouse gestures for deep zooming on devices that use mouse.
43 lines (32 loc) • 1.23 kB
HTML
<html>
<head>
<title>HoverPinchzoom.js Demo</title>
<link rel="stylesheet" href="style.css" />
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
<meta name="apple-mobile-web-app-capable" content="yes" />
<!-- <script type="text/javascript" -->
<script type="text/javascript" src="https://cdn.jsdelivr.net/npm/mouse_hover_pinch_zoom@1.0.3/hover-pinch-zoom.js"></script>
</head>
<body>
<div class="page hover-pinch-zoom-parent">
<div class="hover-pinch-zoom">
<div class="description">
<h1>HoverPinchZoom.js</h1>
<p>
Mouse hover and finger pinch zoom
</p>
</div>
</div>
<div class="hover-pinch-zoom-img" style="width:30vw; height: 70vh;">
<img class="mob" src="mannq.png" />
</div>
</div>
<script type="text/javascript">
document.addEventListener("DOMContentLoaded", function (event) {
var el = document.querySelector('div.hover-pinch-zoom-img');
init_zoom(el);
});
</script>
</body>
</html>