【问题标题】:onsen-ui gestures not workingonsen-ui 手势不起作用
【发布时间】:2015-06-04 12:49:41
【问题描述】:

我需要实现一个外观与温泉滑动菜单完全相同的菜单,但它是从顶部滑动的。我正在考虑使用温泉手势来拖动菜单,但是温泉指南中提供的手势示例不起作用。我错过了什么吗?

  <ons-gesture-detector>
    <div id="detect-area" style="width: 300px; height: 300px;background-color:blue;">
      Swipe Here
    </div>
  </ons-gesture-detector>

  <script>
    alert("in");
    $(document).on('swipeleft', '#detect-area', function() {
      alert("swipe");
    })
  </script>

【问题讨论】:

    标签: onsen-ui gestures monaca


    【解决方案1】:

    试试这个,它应该可以工作。不要忘记先添加jquery。

    <ons-gesture-detector style="height: 300px; margin: 50px 50px;">
        <div id="hoge" style="border: 1px solid #ccc; background-color: #f9f9f9; width: 100%; height: 300px; line-height: 300px; text-align: center; color: #999;">
            ...
        </div>
    </ons-gesture-detector>

    <script>
        var eventName = 
          'drag dragleft dragright dragup dragdown hold release swipe swipeleft swiperight ' +
          'swipeup swipedown tap doubletap touch transform pinch pinchin pinchout rotate';
    
        $(document).on(eventName, '#hoge', function(event) {
          if (event.type !== 'release') {
            $(this).text(event.type);
          }
        });
     </script>

    【讨论】:

    • @user3526468 很高兴它有帮助!请考虑支持我的回答。它将帮助未来遇到相同问题的用户轻松找到解决方案。
    • 我肯定会这样做,但我只有 14 个声望,而投票需要 15 个。当我到达那里时会投票。
    猜你喜欢
    • 1970-01-01
    • 2017-10-15
    • 1970-01-01
    • 1970-01-01
    • 2015-06-24
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2011-05-10
    相关资源
    最近更新 更多