Giter Club home page Giter Club logo

Comments (9)

andersonid avatar andersonid commented on May 10, 2024

will be awesome for mobile concepts!

On Thu, May 28, 2015 at 4:58 AM, jpike88 [email protected] wrote:

Needs ability to swipe side menus in and out of view


Reply to this email directly or view it on GitHub
#25.

Anderson Nobre
Digital Designer

[email protected] [email protected]
(11) 9.8635.5330 *whatsapp, viber
*andersonid
skype

from material.

samws32 avatar samws32 commented on May 10, 2024

check out issue #21

from material.

jpike88 avatar jpike88 commented on May 10, 2024

I've got a workaround.

Download jquery touch swipe and add this script

$(document).ready(function () {


    $("body").swipe( {
        swipeRight:function(event, direction, distance, duration, fingerCount) {
        if($(".menu-right").hasClass("open")){
                            $(".right-menu").trigger("click");
                        } else {
                            $(".left-menu").trigger("click");
                        }
    },
    swipeLeft:function(event, direction, distance, duration, fingerCount) {
        if($(".menu-left").hasClass("open")){
                            $(".left-menu").trigger("click");
                        } else {
                            $(".right-menu").trigger("click");
                        }
    },
                  excludedElements:$.fn.swipe.defaults.excludedElements+", .switch",
                  fallbackToMouseEvents:false,
                  maxTimeThreshold:300
                });
    });

from material.

samws32 avatar samws32 commented on May 10, 2024

https://github.com/mattbryson/TouchSwipe-Jquery-Plugin

download touch swipe here? or anyohter addrrss suggested ?

from material.

jpike88 avatar jpike88 commented on May 10, 2024

thats the one

from material.

samws32 avatar samws32 commented on May 10, 2024

can not work with the above adding script....

from material.

jpike88 avatar jpike88 commented on May 10, 2024

This is a very ugly workaround.

I should have mentioned that you need to add the classes 'left-menu' and 'right-menu' to the buttons that the user would click.

from material.

samws32 avatar samws32 commented on May 10, 2024
    <a class="header-logo" href="index.php"><i class="fa fa-home"></i></a>
    <ul class="nav nav-list pull-right">
        <li>
            <a class="menu-toggle" href="#search">
                <span class="access-hide">Search</span>
                <span class="icon icon-search icon-lg"></span>
                <span class="header-close icon icon-close icon-lg"></span>
            </a>
        </li>
        <li>
            <a class="menu-toggle" href="#profile">
                <span class="access-hide">John Smith</span>
                <span class="avatar avatar-sm"><img alt="alt text for John Smith avatar" src="images/users/avatar-001.jpg"></span>
                <span class="header-close icon icon-close icon-lg"></span>
            </a>
        </li>
    </ul>

do you mean the menu-toggle?

from material.

sesemaya avatar sesemaya commented on May 10, 2024

this seems to be more like a project specific requirement. if a site has menus on both sides or multiple menus on one side such as the demo pages, it'll be tricky to determine what particular actions to call when a horizontal swipe occurs.

i'm afraid i'll not be adding "swipe" in material's base js. "swiping menu in and out of view" is also not documented in google material guideline: http://www.google.com/design/spec/patterns/navigation-drawer.html#navigation-drawer-behavior

from material.

Related Issues (20)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.