微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

jQuery – 更新脚本以支持触摸屏(scrollview)

我一直在使用 jQuery scroll view.该脚本似乎不支持触摸屏,所以我花了一天的时间来试图弄清楚如何为脚本添加触摸屏支持.

我考虑过切换到jQuery draggable,但它不能像上面的脚本看起来那样工作.

有人可以给我一些关于如何为此添加触摸支持的指示或提示吗?

解决方法

使用 jquery.mouse2touch.min.js插件模拟触摸事件的鼠标事件.

Working DEMO

注意:我看到您在原始插件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>

原文地址:https://www.jb51.cc/jquery/177371.html

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。

相关推荐