728x90
frog.jpg
0.24MB
pinch-zoom.umd.js
0.03MB
<!doctype html>
<html>
<head>
<script type="text/javascript" src="pinch-zoom.umd.js"></script>
</head>
<style>
.pinch-zoom-parent {
height: 70vh;
width: 85vw;
border: 5px solid red
}
.pinch-zoom-parent1 {
height: 70vh;
width: 85vw;
border: 5px solid rgb(98, 0, 255)
}
img {
height: 90vh;
}
</style>
<div class="pinch-zoom-parent">
<div class="pinch-zoom">
<img src="frog.jpg"/>
</div>
</div>
<div class="pinch-zoom-parent1">
<div class="pinch-zoom1">
<img src="frog.jpg"/>
</div>
</div>
<script type="text/javascript">
var el = document.querySelector('.pinch-zoom');
new PinchZoom.default(el, {});
var el1 = document.querySelector('.pinch-zoom1');
new PinchZoom.default(el1, {});
</script>
</html>728x90
'Front end > JS (JavaScript)' 카테고리의 다른 글
| [JavaScript]JSON 데이터 value 꺼내기 (0) | 2023.03.15 |
|---|---|
| 자바스크립트 - 배열 중복 제거 (set) (2) | 2022.09.16 |
| 자바스크립트(JavaScript) html select 선택시 이벤트, select 태그 option submit (0) | 2022.08.26 |
| 자바스크립트(JavaScript) - floodfill, 플러드필, 이미지에 색칠하기, 그림판, 이미지 클릭시 색채우기 (0) | 2022.08.25 |
| 자바스크립트(JavaScript) - canvas 색채우기, 캔버스태그, HTML5 canvas채우기 스타일(색상) 지정하기 (fillStyle;채우기, globalAlpha;투명도 ) [펌] (0) | 2022.08.25 |