jQuery Unslide-触摸不会'不起作用

jQuery Unslide - Touch doesn't work

本文关键字：不起作用 Unslide- 触摸 jQuery      更新时间：2023-09-26

我已经解决了这个问题，我发帖只是为了帮助其他人节省一些时间。

我正在为一个商业网站使用unslider，我正在使这个网站具有响应能力，所以在滑块上添加触摸支持的功能很有吸引力。不幸的是，它并不像作者所说的那样直接开箱即用。

更新
我使用的unslider插件已经过时了。我从我第一次发现它的unslider.com下载了它（它在那里仍然是一个过时的版本），因此我遇到了困难。

如果您需要获取最新版本，请访问：https://github.com/idiot/unslider/

如果你想看我的问题报告：https://github.com/idiot/unslider/issues/69

问题是，作者已经4个月没有更新他的项目了，从那以后，滑动事件已经从$.event.swipe移动到$.event.sepecial.swipe。

这个问题发生在unslider插件的第108行，它在那里测试滑动插件的存在。

108: if($.event.swipe) {
109:    this.el.on('swipeleft', _.prev).on('swiperight', _.next);

只需将其更改为：

108: if($.event.special.swipe) {
109:    this.el.on('swipeleft', _.prev).on('swiperight', _.next);

这是一个简单的解决方案，但需要一些谷歌搜索才能弄清楚。

如果你想确保它能与早期版本一起使用，你可以这样做：

108: if($.event.special.swipe || $.event.special.swipe) {
109:    this.el.on('swipeleft', _.prev).on('swiperight', _.next);

但我不建议这样做。

此外，作者没有提到这一点，但滑动插件页面提到了，您需要在脚本中包括jquery.event.swipe之外的jquery.eevent.move。

我希望这对某人有所帮助：）

回答以下评论：

记住按照正确的顺序包括所有文件，并记住所有文件：

<script type="text/javascript" src="/scripts/jquery-1.10.2.min.js"></script>
<script type="text/javascript" src="/scripts/jquery.event.move.js"></script>
<script type="text/javascript" src="/scripts/jquery.event.swipe.js"></script>
<script type="text/javascript" src="/scripts/unslider.min.js"></script>

这对我来说不起作用，但经过大量调整后，我使其顺利工作。我在博客上一步一步地写下了我所做的事情，但没有说明原因。http://frazer.livejournal.com/21898.html

我希望这能有所帮助，尤其是那些刚接触drupal的人。

简而言之，我把这个添加到我的页面上，我得到了响应移动：

var wrap = jQuery(".slides_wrap"),
   slides = wrap.find(".img_slide"),
   width = slides.width();
slides
.on("move", function(e) {
          // Move slides with the finger
// banner has moved -100% when one slide to the right
   var left = 100 * e.deltaX / width;
   wrap[0].style.left = parseInt(wrap[0].style.left.replace("%", ""))+left+"%";
})
.on("moveend", function(e) {
setTimeout(function(){
   var left = parseFloat(wrap[0].style.left.replace("%", ""));
   var left_rounded = Math.round(left/100)*100;
   if(left%100!=0){
     jQuery(".slides_wrap").animate({"left":left_rounded + "%"});
  }
},800);
});

截至今天（2014年11月），滑动功能似乎已被移动所取代。插件的url为http://stephband.info/jquery.event.move/。只需导入此项，而不用滑动。

我希望有人觉得这很有用。必须检查提交才能发现。

我遇到了这个问题，因为我是一个真正的傻瓜，安装Jquery.event.swipe.js模块时遇到了麻烦现在它已经解决了，但这里有一些像我这样的傻瓜一定要检查的事情：

  • 确保您的项目文件夹中同时有github.com/stephband/jquery.event.move.js和github.com/stiphband/j query.event.swipe.js
  • 在html文件中引用这两个文件
  • 确保你的projet文件夹中也有unslider.js文件（我有unslide.min.js文件，它不够完整，无法使滑动插件工作）

html文件中不需要额外的javascript代码，它应该可以与上面的一起工作（至少对我来说是这样）

这两个都是非常好的免费工具，这要归功于编码器

相关文章：