Wha*_*ame 4 html5 multi-touch touch css3 jquery-mobile
我一直在寻找一个简单的解决方案,如何在不影响网站其他部分的情况下放大和缩小图像(png),但没有找到.
有没有人使用这样的工具或知道使用jQuery或javascript的方法?我是jQuery的新手,所以不知道我应该看看哪些事件.此功能应适用于Android平板电脑和iPad.
看看JQuery Mobile Pinch Zoom Image Only和提供的链接,但显然是那些使用PhoneGap的链接.
谢谢你的帮助.
小智 6
我没有找到解决方案,所以我自己实现了(使用vanilla JS和canvas但可移植到css3):https://github.com/rombdn/img-touch-canvas
示例:http://www.rombdn.com/img-touch-canvas/demo(更好的是使用触摸设备,但在桌面上使用+/-和鼠标拖动)
<html>
<body>
<div style="width: your_image_width; height: your_image_height">
<canvas id="mycanvas" style="width: 100%; height: 100%"></canvas>
</div>
<script src="img-touch-canvas.js"></script>
<script>
var gesturableImg = new ImgTouchCanvas({
canvas: document.getElementById('mycanvas'),
path: "your image url"
});
</script>
</body>
</html>
Run Code Online (Sandbox Code Playgroud)