Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/chrisdwheatley/material-design-hamburger
Android's Material Design hamburger animation built in CSS
https://github.com/chrisdwheatley/material-design-hamburger
Last synced: 14 days ago
JSON representation
Android's Material Design hamburger animation built in CSS
- Host: GitHub
- URL: https://github.com/chrisdwheatley/material-design-hamburger
- Owner: chrisdwheatley
- Created: 2014-10-19T19:30:45.000Z (about 10 years ago)
- Default Branch: master
- Last Pushed: 2015-02-07T21:37:58.000Z (almost 10 years ago)
- Last Synced: 2024-05-21T08:33:16.086Z (7 months ago)
- Language: CSS
- Homepage: http://codepen.io/swirlycheetah/pen/cFtzb
- Size: 233 KB
- Stars: 90
- Watchers: 9
- Forks: 11
- Open Issues: 2
-
Metadata Files:
- Readme: readme.md
Awesome Lists containing this project
- awesome-material - material-design-hamburger
README
# Material Design Hamburger
Android's Material Design hamburger animation built in CSS (with a sprinkle of JS).
![Material Design Hamburger](https://i.imgur.com/B0PT1Lb.gif)
### Example Usage
See [this pen](http://codepen.io/swirlycheetah/pen/cFtzb) for a styled example.
### Browser Support
Currently supporting the 2 latest versions of each major browser (IE10+) with the aim to support IE8+ in the future.
### Installation & Usage
#### Download
__Download the [latest release](https://github.com/swirlycheetah/material-design-hamburger/releases/latest).__
__Include the CSS & JS files from the `dist` folder where desired within your project.__
__Add the following HTML elements.__
```html
```
#### npm
__Install the package (use --save or --save-dev if required).__
`npm install material-design-hamburger`
__Include the CSS & JS where required.__
```html
```
```html
materialDesignHamburger()
```__Add the following HTML elements.__
```html
```
#### Bower
__Install the package (use --save or --save-dev if required).__
`bower install material-design-hamburger --save-dev`
__Include the CSS & JS where required.__
```html
```
```htmlmaterialDesignHamburger()
```__Add the following HTML elements.__
```html
```
### Contributing
All contributions, no matter how big or small, are welcome. Follow these steps to contribute.
* Clone the repository
`git clone [email protected]:swirlycheetah/material-design-hamburger.git && cd material-design-hamburger`
* Install the required dependencies
`npm install`
* Make amendments in the `src` folder followed by running `gulp build` (or `./node_modules/gulp/bin/gulp.js build`) to build the changes in the dist folder
* Ensure there are no lint errors
* Ensure the example in the `examples/basic-example` folder still works as required
* Push your changes and submit a pull request
### In The Wild* [APK Mirror](http://www.apkmirror.com/) (only at viewport widths smaller than 993px)
### Roadmap
* Better browser support
* Unit tests
* More examples
* Easier customisation### License
Released under the MIT license: [opensource.org/licenses/MIT](http://opensource.org/licenses/MIT)