-
Notifications
You must be signed in to change notification settings - Fork 217
Touch/Swipe Integration #6
Comments
Yes, yes and yes!!! This is something I am trying to do, I think we defo need some pros involved to make this happen. Currently I am working on a bootstrap template with this and a few extras to make an epic starting point for any web designer. If this was added with easy toggles (on/off) for quick builds it would be epic! |
Have you seen the mashable site (http://mashable.com/) they have an epic responsive menu which I would love to make. This nav is almost the same just lacking a few parts but still an awesome start |
I got the desired effect for swipeopen/close with hammer.js by appending it to "body" and using: document.getElementById('outer-wrap').addEventListener('swipe', app.toggleNav, false); You can of course do one for swipeleft -> app.closeNav() and one for swiperight -> app.openNav() |
Another gorgeous implementation is on Yahoo Answers mobile site. |
@voodoo6 Thanks for bringing up the swipe script. Unfortunately, as you say, it lacks finesse, and is merely a proof of concept. To add swipe support, you need to use javascript. There are lots of libraries out there that can help you with this. With the [https://github.com/dbushell/Responsive-Off-Canvas-Menu/blob/master/js/main.js](javascript included in this repo), all you need is to detect a swipe and then call openNav, closeNav or toggleNav. Should be easy :) One hurdle is conflicts with other swipable objects, like image galleries, where sideways swipes may be used for browsing through images. |
Firstly, thanks for this - its the best off-canvas implementation I've seen, most importantly, it feels good when in use..
To help 'close the gap' with native apps further, I think this would really benefit from some additions:
As mentioned in the smashing-mag post, Hammer.js looks like it could help with the touch events. I also found this recently which is the best swipe-able off-canvas nav I've found (most others I found are too 'twitchy' and don't have a native feel). However it lacks the finesse of this menu and I think uses Jquery for the animations.
I'm currently learning javascript and jquery so have limited skills to implement what I've mentioned - It would be really helpful if anybody has any resources or forks which have these additional functionality mentioned to share?
The text was updated successfully, but these errors were encountered: