基金会5非画布滑动 [英] Foundation 5 Off-canvas Swipe

问题描述

是否可以通过滑动手势打开和关闭Foundation 5的Canvas菜单?

Is it possible to open and close the Foundation 5 Off-Canvas menu with swipe gestures?

参考: http://foundation.zurb.com/docs/components/offcanvas. html

推荐答案

Foundation当前不支持此功能，但是有一个使用jQuery Mobile的简单解决方案.请注意，此示例用于左侧的单个画布.

This feature is currently not supported by Foundation, but there is a simple solution using jQuery Mobile. Note that this example is for a single off-canvas to the left.

首先，请确保包括jQuery和JQM:

First, be sure to include jQuery and JQM:

jQuery: http://jquery.com/
jQuery Mobile: http://jquerymobile.com/

jQuery: http://jquery.com/
jQuery Mobile: http://jquerymobile.com/

然后添加以下内容:

$( document ).on( "swipeleft swiperight", function( e ) {
    if ( $.mobile.activePage.jqmData( "panel" ) !== "open" ) {
        if ( e.type === "swipeleft"  ) {
            $('.off-canvas-wrap').removeClass('move-right');
        } else if ( e.type === "swiperight" ) {
            $('.off-canvas-wrap').addClass('move-right');
        }
    }
});

以为我会分享，因为我找不到任何解决方案！

Just thought I'd share since I couldn't find any solutions!

这篇关于基金会5非画布滑动的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！