`

jquery三种支持手机触屏的插件库

 
阅读更多
http://my.oschina.net/u/2395167/blog/522582
因为最近开发的项目涉及到移动设备上的 HTML5 开发,其中需要实现轮播效果。然后最快捷的方式,你知道(Bootstrap),然后原生的 Bootstrap 的 carousel.js 插件并没有支持手势。

如下有三种方式:

1、下载jquerymobile库文件,导入js文件:

调用:swipeleft 和  swiperight 或 swipe  事件

2、使用TouchSwipe jQuery plugin 插件  地址:https://github.com/mattbryson/TouchSwipe-Jquery-Plugin

使用方法:
$("#carousel-generic").swipe({
  swipeLeft: function() { $(this).carousel('next'); },
  swipeRight: function() { $(this).carousel('prev'); },
 });

3、使用hammer.js(http://eightmedia.github.io/hammer.js/) + jquery.hammer.js (https://github.com/EightMedia/jquery.hammer.js)插件。

使用方法:
$('#carousel-generic').hammer().on('swipeleft', function(){
  //$(this).carousel('next');
 });
$('#carousel-generic').hammer().on('swiperight', function(){
  //$(this).carousel('prev');
 });
分享到:
评论

相关推荐

    jQuery图片点击放大支持手机触屏滑动图片展示

    综上所述,实现jQuery图片点击放大及手机触屏滑动展示的功能涉及到了jQuery的选择器、事件绑定、CSS变换、触摸事件处理以及性能优化等多个方面,这需要开发者具备扎实的JavaScript和jQuery基础,以及对移动设备特性...

    jQuery响应式手机触屏滑动插件

    三、jQuery响应式手机触屏滑动插件 针对手机触屏的滑动事件,jQuery提供了插件来优化这一交互体验。这些插件通常会检测用户的触摸动作,如滑动、捏合缩放等,并提供相应的回调函数,使开发者可以自定义响应行为。...

    jQuery手机移动端日期时间选择插件

    "jQuery手机移动端日期时间选择插件"正是为了解决这个问题而诞生的。这个插件旨在提供一个直观、易用的日期和时间选择器,适用于手机和平板等移动设备的网页应用。 jQuery是一个广泛使用的JavaScript库,它简化了...

    基于Jquery的手机触摸屏事件插件,可以辨别手机触摸滑动事件的方向等。

    `jQuery`,作为一个广泛使用的JavaScript库,虽然默认不包含对触摸事件的处理,但可以通过各种插件来扩展其功能,比如本话题提到的"基于jQuery的手机触摸屏事件插件"。这个插件,名为`TouchSwipe`,专门设计用于识别...

    基于Swiper插件的触屏滑动jQuery相册代码

    基于Swiper插件的触屏滑动jQuery相册代码 基于Swiper插件的触屏滑动jQuery相册代码 基于Swiper插件的触屏滑动jQuery相册代码 基于Swiper插件的触屏滑动jQuery相册代码

    jquery手机触屏拖拽

    这个插件利用了jQuery库,提供了触屏设备上流畅的图片轮播体验,用户可以通过手势滑动切换图片,增强了互动性。 【jQuery】:jQuery是一个广泛使用的JavaScript库,它简化了HTML文档遍历、事件处理、动画和Ajax交互...

    jQuery响应式手机端触屏滑动图片轮播插件

    **jQuery响应式手机端触屏滑动图片轮播插件** 在现代网页设计中,图片轮播已经成为一种常见的展示方式,特别是在手机端,它能够高效地利用有限的屏幕空间来展示多张图片或内容。jQuery作为一款轻量级的JavaScript库...

    jQuery+html5手机触屏滑动图片切换代码

    【jQuery+html5手机触屏滑动图片切换代码】是一种常见的移动端网页设计技术,它结合了JavaScript库jQuery和HTML5的新特性,为用户提供了一种流畅的触控体验,特别是对于展示图片轮播或幻灯片效果的应用场景。...

    jQuery 3D卡片天气预报插件 支持手机端滑动

    在手机端,该插件还支持触摸滑动,让用户只需轻轻一划,就能查看不同的天气预报卡片,这种流畅的体验得益于jQuery对触屏事件的精确处理和优化。 在手机端实现滑动功能,通常会用到jQuery的swipe事件或者Hammer.js等...

    jQuery html5支持手机触屏幻灯片图片轮播代码

    "jQuery html5支持手机触屏幻灯片图片轮播代码"就是一个这样的实例,它结合了强大的JavaScript库jQuery和HTML5的新特性,旨在为桌面和移动设备提供无缝的图片轮播功能。下面将详细解析这个主题所涉及的知识点。 ...

    jQuery html5支持手机触屏幻灯片图片轮播图.zip

    实现效果: jQuery html5支持手机触屏幻灯片图片轮播图,点击图片,实现图片之间的切换,非常适用于我们的企业网站或者商城网站,添加轮播图,使网站变得更加美观。php中文网推荐下载!

    jQuery手机触屏拖动滑块验证跳转插件

    针对这一需求,"jQuery手机触屏拖动滑块验证跳转插件"应运而生,它提供了一种简单且直观的方式来确保用户验证,并在验证成功后能直接跳转至特定网址。这个插件巧妙地融合了电脑端和移动端的交互方式,确保无论是在...

    jQuery九宫格手机锁屏插件.zip

    同时,为了适应移动设备,插件还考虑了触屏设备的触摸事件,确保在手机和平板上的良好运行。 `说明.htm` 文件可能包含了详细的使用指南和示例代码,帮助开发者快速理解和集成此插件。它通常会涵盖如何引入jQuery库...

    jQuery手机端时间表格选择插件_1.zip

    jQuery作为一种广泛使用的JavaScript库,提供了丰富的插件来简化前端开发,其中就包括用于手机端的时间表格选择插件。本文将深入探讨这种插件的原理、使用方法以及其在实际项目中的应用。 一、插件概述 jQuery手机...

    jquery手机端带农历的万年历插件

    总的来说,"jquery手机端带农历的万年历插件"结合了jQuery和Swiper.js的优点,提供了一种方便、直观的移动端日期选择解决方案,同时支持农历显示,对于需要在手机应用或网站上集成日期选择功能的开发者来说,这是一...

    鼠标双击或触摸双击事件检测jQuery插件

    jQuery-doubleTap插件提供了一种高效、易于集成的方法,使得开发者可以轻松地在网页中添加鼠标双击和触摸屏双击事件的检测。通过其简洁的API,开发者可以快速实现丰富的交互效果,提高用户体验,尤其在移动设备上,...

    jQuery拖动滑块图片拼图验证码插件.zip

    《jQuery拖动滑块图片拼图验证码插件详解》 在网页开发中,验证码是一种防止自动化程序(如机器人)非法操作的重要手段。随着技术的发展,传统的数字或字母组合验证码已经逐渐被更人性化的图形验证码所取代,其中...

    jQuery手机触屏拖动滑块验证跳转插件.zip

    《jQuery手机触屏拖动滑块验证跳转插件详解》 在当今移动互联网时代,网页交互体验成为了吸引用户的关键因素。jQuery作为一个轻量级、功能丰富的JavaScript库,为开发者提供了许多便捷的API,用于创建复杂的网页...

    jQuery支持触摸屏的强大响应式轮播图插件

    本篇文章将深入探讨jQuery如何支持触摸屏并创建强大响应式的轮播图插件。 首先,让我们理解什么是jQuery。jQuery是一个简洁、高效的JavaScript库,它简化了HTML文档遍历、事件处理、动画制作和Ajax交互。jQuery的...

Global site tag (gtag.js) - Google Analytics