【问题标题】:Make div height the distance of swipe down使 div 高度为向下滑动的距离
【发布时间】:2013-11-02 20:34:21
【问题描述】:

我正在尝试在 body 上发生向下滑动事件时逐渐显示 div。

我目前正在使用 jQuery 版本的hammer.js 来监听向下滑动,但是当滑动发生在该值时,我如何获取滑动距离并更改 div 的高度?

这并不多,但这是我目前所拥有的:

var distance;
$('body').on('swipedown', function(){

    // set distance to swipe distance
    $('header, #header, [role="banner"]').css('height', distance);
});

但是,上面不是只设置向下滑动结束时的距离吗?向下滑动时如何设置距离?

我将不胜感激任何和所有的帮助!

【问题讨论】:

    标签: javascript jquery gesture hammer.js


    【解决方案1】:

    通过hammer.js swipedown事件触发,你的函数会在事件对象中获取一个手势对象。

    你可以这样得到

    Hammer(document.body).on('swipedown', function(e){
        gesture = e.gesture
    
        // gesture.distance or gesture.deltaY is swipe distance
        // and you can console.log(gesture) to find more!
    });
    

    【讨论】:

    • 啊,我明白了。谢谢你。等等,我在试试。为什么当我向下滑动时这不起作用:jsfiddle.net/ExeXq/1
    • 如果使用鼠标,锤子事件很难触发。我不确定,但它可能是框架错误?您应该为 body 和 html 标签添加样式 {height: 100%} 以获得最大检测区域。
    • 我增加了身体的触摸区域,我正在使用 Hammer 就像示例一样。我正在移动设备上进行测试。这里:jsfiddle.net/ExeXq/3
    猜你喜欢
    • 2012-02-27
    • 2016-04-06
    • 2014-05-16
    • 1970-01-01
    • 2021-12-06
    • 2016-05-25
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多