精华内容
下载资源
问答
  • 支持bootstrap滑动轮播。 hammer,jquery.hammer.js,hammer/hammer.min.js
  • jquery.hammer.js 这个jQuery插件只是Hammer()类的一个小包装。 它还通过触发jQuery事件来扩展Manager.emit方法。 $ ( element ) . hammer ( options ) . bind ( "pan" , myPanHandler ) ; Hammer实例存储在$...
  • vue hammer.js 威汉锤 (vue-hammer) Hammer.js wrapper for Vue to support some operation in the mobile. Vue的Hammer.js包装器支持移动设备中的某些操作。 This is a directive wrapper for Hammer.js 2.x. And...

    vue hammer.js

    威汉锤 (vue-hammer)

    Hammer.js wrapper for Vue to support some operation in the mobile.

    Vue的Hammer.js包装器支持移动设备中的某些操作。

    This is a directive wrapper for Hammer.js 2.x. And this repo'inspiration is from v-touch.

    这是Hammer.js 2.x的指令包装。 而这种回购的灵感来自v-touch。

    安装 (Install)

    This plugin supports Vue >= 2.0.

    该插件支持Vue> = 2.0。

    npm (npm)

    Available through npm as vue2-hammer.

    通过npm作为vue2-hammer可用。

    npm install vue2-hammer
    import { VueHammer } from 'vue2-hammer'
    Vue.use(VueHammer)

    用法 (Usage)

    使用v-hammer指令 (Using the v-hammer directive)

    <a v-hammer:tap="onTap">Tap me!</a>
    
    <div v-hammer:swipe.left="onSwipeLeft">Swipe me!</div>

    配置识别器选项 (Configuring Recognizer Options)

    There are two ways to customize recognizer options such as direction and threshold. The first one is setting global options:

    有两种方法可以自定义识别器选项,例如directionthreshold 。 第一个是设置全局选项:

    // change the threshold for all swipe recognizers
    VueHammer.config.swipe = {
      threshold: 200
    }
    <a v-hammer:doubletap="onDoubleTap"></a>

    支持的手势和方向 (Supported gestures and directions)

    手势 (gestures)

    tap, pan, pinch, press, rotate, swipe, doubletap

    点击,平移,捏,按,旋转,轻扫,双击

    指示 (directions)

    up, down, left, right, horizontal, vertical, all

    上,下,左,右,水平,垂直,全部

    注意 (Note)

    Users can use both the gesture and the direction like v-hammer:swipe.left. But if your combination is not exist in the hammer, it is not support.

    用户可以使用手势和方向,例如v-hammer:swipe.left 。 但是,如果您的组合在锤子中不存在,则不支持。

    运行示例 (Run the Example)

    • Run yarn or npm i

      运行yarnnpm i

    • Run yarn build or npm run build

      运行yarn buildnpm run build

    • Open the index.html in the example directory.

      在示例目录中打开index.html。

    翻译自: https://vuejsexamples.com/hammer-js-wrapper-for-vue-2-x-to-support-mobile-touch/

    vue hammer.js

    展开全文
  • Package runspired/hammer.js=runspired/hammer.js not found Error: Package runspired/hammer.js=runspired/hammer.js not found at createError (/ui/node_modules/ember-cli/node_modules/bower/lib/...
  • <div><p>Any idea how i can fix it? Thank you!</p><p>该提问来源于开源项目:hammerjs/jquery.hammer.js</p></div>
  • hammer.js A JavaScript library for detecting touch gestures. Installation NPM npm install --save hammerjs or Yarn yarn add hammerjs or CDN https://cdnjs.com/libraries/hammer.js/ Usage hammer....
  • hammer.js

    2018-11-01 16:29:24
    hammer.js基本使用

        hammer.js基本使用

    展开全文
  • Hammer.js

    2015-12-23 23:08:42
    Hammer.js是一个专门用于控制、定制手势的轻量级JavaScript框架,可以识别出常见的触摸、拖动、长按、缩放等手势。

    Hammer.js是一个专门用于控制、定制手势的轻量级JavaScript框架,可以识别出常见的触摸、拖动、长按、缩放等手势。

    扩展阅读:

    http://hammerjs.github.io/

    http://www.cnblogs.com/iamlilinfeng/p/4239957.html

    http://www.oschina.net/p/hammerjs

    http://newhtml.net/hammer-js-专业的手势控制javascript库/

    CDN
    http://www.bootcdn.cn/hammer.js/

    展开全文
  • Hammer.js分析

    2016-02-09 18:34:19
    Hammer.js分析
  • 主要为大家详细介绍了一款开源的移动端脚本框架Hammer.js,可以完美的实现在移端开发的大多数事件,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
  • jquery.hammer.js使用时要先引入hammer.min.js 下面代码是滑动效果: $("#nav").hammer().bind('swiperight', function (e) { $("#result").html(e.gesture.deltaX) var currPos = $(".menu").scro...
    jquery.hammer.js使用时要先引入hammer.min.js
    下面代码是滑动效果:
      $("#nav").hammer().bind('swiperight', function (e) {
                    $("#result").html(e.gesture.deltaX)
                    var currPos = $(".menu").scrollLeft();
                    var currPos = $(".menu").scrollLeft();
                    var p = currPos - e.gesture.deltaX * 3;
                    if (p > $("#menu").offset().left) {
                    p= $("#menu").offset().left;
                    }
                    // $("#menu").scrollLeft($("#menu").scrollLeft() - e.gesture.deltaX);
                    $("#menu").animate({ scrollLeft: p + "px" }, "slow");
                });
     
    然后在使用!一下是hammer中对应e的参数信息█是一级属性:两端的为2级属性!
    比如e的属性有type,gesture 
    其中gesture的属性有pointers,changedPointers,pointerType 下一个█之前

    在手机上输出参数!

    没找到在电脑上调试hammer的方法!所以只能在手机上输出到层里面!
      $("#nav").hammer().bind('swipeleft', function (e) {
                    $("#result").html(e.gesture.deltaX)
                    //$("#menu").scrollLeft($("#menu").scrollLeft() - e.gesture.deltaX);
                    var currPos = $(".menu").scrollLeft();
                    var p = currPos - e.gesture.deltaX * 3;
                    if (p <= 0)
                        p = 0;
                    $("#menu").animate({ scrollLeft: p + "px" }, "slow");
                    
                                                    for (a in e) {
                                                        document.getElementById("result").innerHTML += a + "█<br/>";
                                                        if (e[a] instanceof Object) {

                                                            for (b in e[a]) {
                                                                document.getElementById("result").innerHTML += b + ":<br/>";
                                                                document.getElementById("result").innerHTML += e[a][b] + "<br/>";
                                                            }
                                                            document.getElementById["result"] += "<br/>";
                                                        }
                                                        else {
                                                            document.getElementById("result").innerHTML += "|" + e[a] + "<br/>";
                                                        }

                                                    }
                });
     

    层里获取到的e参数

     
      type█
    |swipeleft
    gesture█

    pointers:
    [object Touch]

    changedPointers:
    [object Touch]

    pointerType:
    touch

    srcEvent:
    [object TouchEvent]

    isFirst:
    false

    isFinal:
    true

    eventType:
    4

    center:
    [object Object]

    timeStamp:
    1433406137249

    deltaTime:
    117

    angle:
    169.11447294534125

    distance:
    52.952809179494906

    deltaX:
    -52
    deltaY:
    10
    offsetDirection:
    4
    scale:
    1
    rotation:
    0
    velocity:
    0.9705882352941176
    velocityX:
    0.9705882352941176
    velocityY:
    -0.23529411764705882
    direction:
    2
    target:
    [object HTMLDivElement]
    timeStamp█
    |1433406137250
    jQuery20009665961118880659█
    |true
    isTrigger█
    |3
    namespace█
    |
    namespace_re█
    |null
    result█
    |undefined
    target█
    nodeName:
    DIV
    spellcheck:
    true
    previousElementSibling:
    [object HTMLDivElement]
    offsetTop:
    0
    firstChild:
    [object Text]
    lastElementChild:
    [object HTMLDivElement]
    outerText:
    aaa bbb ccc ddd eee fff ggg hhh iii jjj kkk lll mmm nnn ooo ppp 
    innerHTML:
    aaa bbb ccc ddd eee fff ggg hhh iii jjj kkk lll mmm nnn ooo ppp

    转载于:https://www.cnblogs.com/360qq/p/4552254.html

    展开全文
  • hammer.js 2.* support

    2020-12-27 14:44:37
    <div><p>Currently dragging is not working in latest Chrome when Hammer.js 2.* is loaded. At least should be mentioned via docs.</p><p>该提问来源于开源项目:acornejo/jquery-cropbox</p></div>
  • 本文实例为大家分享了hammer.js实现图片手势放大效果的具体代码,供大家参考,具体内容如下 //图片手势放大 var reqAnimationFrame = (function() { return window[Hammer.prefixed(window, '...
  • hammer.js移动端图片手指缩放插件

    千次下载 热门讨论 2015-07-22 22:58:30
    手机移动端手指缩放图片的插件hammer.js
  • 关于hammer.js Hammer.js是一个开源的,轻量级的javascript库,它可以在不需要依赖其他东西的情况下识别触摸,鼠标事件。 这里给出关于hammer的实例网址 GitHub: ...
  • 主要介绍了Hammer.js+轮播原理实现简洁的滑屏功能的相关资料,需要的朋友可以参考下
  • I also unloaded hammer.js and did not notice any FCE that is nopt working. Might I ask what hammer.js was for? <p>Why I want to remove it? <p>it was in v2.0.7 (v2.0.8 already released) and last ...
  • <p>Now, I need to fire onDragStart and onDragStop events on the Hammer.js' press and pressup events. How do I achieve this? <p>Here is a <a href="http://stackoverflow....

空空如也

空空如也

1 2 3 4 5 ... 20
收藏数 680
精华内容 272
关键字:

Hammer.js