javascript - 使 div 高度为向下滑动的距离

Question

我试图在身体上发生向下滑动事件时逐渐显示一个 div。

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

它并不多，但这是我到目前为止所拥有的：

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

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

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

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

Answer 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!
});