Comments (9)
Good idea! I'll add support for right side off-canvas navigation in a future release. I think it would be a good idea to re-write this as a proper jQuery plugin and allow the user to specify the orientation of pushy (left or right).
from pushy.
Right side off-canvas navigation would be fantastic! I look forward to seeing the future plugin release.
Any recommendations on how to enable this feature manually in the meantime?
from pushy.
Just adding .pushy-right would be sweet.
from pushy.
Here's a quick way to get the menu to open on the right hand side.
Add
.pushy-right{
-webkit-transform: translate3d(200px,0,0);
-moz-transform: translate3d(200px,0,0);
-ms-transform: translate3d(200px,0,0);
-o-transform: translate3d(200px,0,0);
transform: translate3d(200px,0,0);
}
Change the class in the HTML
to pushy-right
from pushy-left
CSS
.pushy
, add
right:0;
change .container-push, .push-push {}
to:
.container-push, .push-push{
-webkit-transform: translate3d(-200px,0,0);
-moz-transform: translate3d(-200px,0,0);
-ms-transform: translate3d(-200px,0,0);
-o-transform: translate3d(-200px,0,0);
transform: translate3d(-200px,0,0);
}
and pushy-active .site-overlay
to:
.pushy-active .site-overlay{
display: block;
position: fixed;
top: 0;
right: 200px;
bottom: 0;
left: 0px;
z-index: 9999;
}
I also had to add a new style for the menu-btn
, as it was moving off screen,
.menu-btn {
position:absolute;
top:0;
right:0;
}
Can't really submit a pull-request with this, as it conflicts with the current functionality. But as mentioned above a jQuery
plugin to choose which direction to open the menu from would be sweet.
from pushy.
As the above.
https://github.com/CHEWX/pushy
from pushy.
It would be nice to be able to have a left AND right side menu at the same time, both working independently of each other.
Is this menu dead in the water? Haven't seen any activity for a while...
from pushy.
@Jakobud - I've now done a very quick version with both functional left and right menus - https://github.com/CHEWX/pushy-left-right
from pushy.
Estaba buscando como alinear pushy al lado derecho de la pantalla. Gracias, me sirvió mucho c:
from pushy.
Pushy now supports left or right menu position. See the the read me for more information,
from pushy.
Related Issues (20)
- Pushy in NPM packages. HOT 2
- Menu don't work with vue js 2 HOT 1
- iOS Mobile Container Scrolling Bug
- Third level submenu HOT 1
- Menu transitions on page load HOT 2
- Can width be set to 100% HOT 2
- Can I have a left menu and right menu? HOT 1
- Rearrange menu items for desktop HOT 3
- Fit Pushy for container width. HOT 1
- How can we stop the container scroll going to top, while we are opening Pushy-Menu HOT 1
- sidebar incompatible with jquery 3.1.1 HOT 1
- BS4 Dropdown Class for On-Canvas Multi-Line Menu HOT 1
- Change menu-btn class HOT 6
- Error don't appear the pushy menu HOT 1
- Desktop: Close '.pushy ul ul ' when clicking away from element
- Menu shows when loading page HOT 1
- Mobile Site Menu is not loading properly HOT 2
- Save a network request by encoding the arrow svg in the css instead of externally linking it HOT 1
- How to focus on a li tag within a submenu? HOT 3
- Multiple Pushy in one page
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
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.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from pushy.