Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Support for closing on click and edge slide in options. #10

Closed
wants to merge 1 commit into from
Closed

Support for closing on click and edge slide in options. #10

wants to merge 1 commit into from

Conversation

lewie9021
Copy link

It's common in mobile apps for the menu to only slide in when dragged from the edge of the screen (not the whole screen). The new grabWidth option will allow configuring what threshold this is. If not specified, the behaviour will revert back to how it currently is. I have also added an option to allow closing the menu when it's opened (closeOnClick) by simply clicking the panel element.

@pazguille
Copy link
Member

Hmm, not sure about grabWidth option. What do others think?

I really like closeOnClick option but you can do it from outside. I would like to keep slideout.js as tiny as possible.

document.querySelector('.slideout-panel').addEventListener('click', function(eve) {
  if (slideout.isOpen()) {
    eve.preventDefault();
    slideout.close();
  }
});

@lewie9021
Copy link
Author

I do agree about closeOnClick as it's rather simple to implement the feature if they wish so.

As for grabWidth, I feel it's necessary since the menu will slide out with any horizontal scrolling in the panel content. It's also common behaviour with most off canvas menus (or at least the ones I have used) for the menu to only slide out when swiped from the edge.

@ZinedinShiqin
Copy link

{Arch Rom} (Phonetics) , for this phone and the line between.thanks

@garygreen
Copy link

@pazguille I'm actually the other way around, I dislike the closeOnClick that seems pretty subjective, I personally don't like the idea of panel closing on click but the grabWidth really does need to be implemented. It seems so strange to have the whole page listen to when the slider should open... there should be an option to confine to the side of the screen, which is pretty much the standard in most mobile apps and the adopted standard in Android.

+1 to this PR though, it fixes a lot of issues when you have sliding carousels in your page etc. Also helps prevents the menu starting to open sometimes when your scrolling.

@garygreen
Copy link

@pazguille any news on if this PR will be accepted or left open forever? ;D

@garygreen garygreen mentioned this pull request Apr 21, 2015
@nicmare
Copy link

nicmare commented May 21, 2015

vote!

@lewie9021 lewie9021 closed this Jun 16, 2015
patrickleet added a commit to patrickleet/meteor-slideout that referenced this pull request Jul 10, 2015
@garygreen
Copy link

@pazguille PLEASE can you look at this and make a decision? I find it so frustrating (and my users) that the menu can be triggered from anywhere on the page. There should be an option to confine it to only open within X amount of pixels from the screen, which this PR does perfectly.

swelther pushed a commit to swelther/slideout that referenced this pull request Aug 19, 2015
swelther pushed a commit to swelther/slideout that referenced this pull request Aug 19, 2015
alancasagrande pushed a commit to alancasagrande/slideout that referenced this pull request Nov 10, 2015
@mauron85
Copy link

+1

1 similar comment
@jonathandey
Copy link

+1

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

None yet

7 participants