我一直在使用
jQuery scroll view.该脚本似乎不支持触摸屏,所以我花了一天的时间来试图弄清楚如何为脚本添加触摸屏支持.
我考虑过切换到jQuery draggable,但它不能像上面的脚本看起来那样工作.
解决方法
使用
jquery.mouse2touch.min.js插件模拟触摸事件的鼠标事件.
注意：我看到您在原始插件jquery.scrollview.js中进行了一些代码更改以添加触摸事件.请使用原始的$(“#elment”).mouse2touch()将鼠标事件处理程序行为应用于触摸事件.
Steps to apply this FIX
>包括jquery.min.js后
>包括jquery.scrollview.js的原始插件
>包括插件jquery.mouse2touch.min.js
>现在,您可以使用此行$(“#map”)将鼠标事件映射到触摸事件.rollview().mouse2touch()
以下是代码
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="//increstedbutte.com/wp-content/themes/crestedbutte/style.css" />
</head>
<body>
<h1>Scroll Demo Plunker!</h1>
<div id="map">
<div id="spring" style="opacity: 1;">
<img width="3800" height="1200" src="http://increstedbutte.com/wp-content/uploads/2013/07/crested-butte-town-map_spring-v2.jpg" class="attachment- wp-post-image" alt="Crested Butte Town Map - Spring">
</div>
</div>
<script src="//cdnjs.cloudflare.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="//jquery-scrollview.googlecode.com/svn-history/r2/trunk/jquery.scrollview.js"></script>
<script src="//cdn.rawgit.com/vpanga/jquery.mouse2touch/master/src/jquery.mouse2touch.min.js"></script>
<script>
$(function() {
$("#map").scrollview().mouse2touch();
});
</script>
</body>
</html>
