2015-06-04 3 views
1

Мне нужно реализовать меню с такими же взглядами, как и скользящее меню onsen, но это слайд сверху. Я думал использовать жесты onsen, чтобы перетаскивать меню, но образец жестов, предоставленный в руководстве onsen, не работает. Я что-то упускаю?жестов onsen-ui не работает

<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> 

ответ

2

Попробуйте это, оно должно работать. Не забудьте сначала добавить 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>

+0

Великий, это решить ее! – user3526468

+0

@ user3526468 рад, что это помогло! Пожалуйста, рассмотрите мой ответ. Это поможет будущим пользователям с той же проблемой легко найти решение. –

+0

Я бы точно это сделал, но у меня только 14 репутации, а upvote требуется 15. Будет ли повышаться, когда/если я туда доберусь. – user3526468

Смежные вопросы