https://github.com/geedmo/yamm3

Yet another megamenu for Bootstrap 3
https://github.com/geedmo/yamm3

Last synced: 13 days ago
JSON representation

Yet another megamenu for Bootstrap 3

• Host: GitHub
• URL: https://github.com/geedmo/yamm3
• Owner: geedmo
• License: mit
• Created: 2013-11-22T19:33:14.000Z (over 12 years ago)
• Default Branch: master
• Last Pushed: 2021-04-01T03:05:47.000Z (almost 5 years ago)
• Last Synced: 2026-01-24T03:32:59.535Z (about 1 month ago)
• Language: HTML
• Homepage: http://geedmo.github.io/yamm3/
• Size: 867 KB
• Stars: 1,194
• Watchers: 77
• Forks: 179
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • Contributing: .github/CONTRIBUTING.md
  • License: LICENSE.txt

Awesome Lists containing this project

• awesome-jquery - Yamm - Yet another megamenu for Bootstrap 3. (Animation / Menus)

README

          
# Yamm

This is *Yet another megamenu for [Bootstrap 3](http://getbootstrap.com/)* from Twitter.

Lightweight and pure CSS megamenu that uses the standard navbar markup and the fluid grid system classes from Bootstrap 3. Work for fixed and responsive layout and has the facility to include (almost) any Bootstrap elements.

#### [Demo](http://geedmo.github.io/yamm3)

Here you can find [Yamm for Bootstrap 4](https://github.com/geedmo/yamm)

### Install with npm

    npm install @geedmo/yamm3 --save

### Install with bower

    bower install yamm3 --save

### Install via composer

    {

        "require": {

            "geedmo/yamm3": "dev-master"

        }

    }

### Markup

1. Reuse navbar markup and add class `.yamm` at the top.

2. Then add your markup into the `.dropdown-menu`

3. Optionally use `.yamm-content` to wrap content with padding.

Example

    

        ...

        


            


                Dropdown

                


                    


                        


                        


                            ...

                    

                

            

        

        ...

    


### Fullwidth

By default every mega-dropdown will take the content size so is possible to use add `.yamm-fw` to `.dropdown` to expand it fullwidth.

Yamm works better with fullwidth menus.

Example

    

    ...

         


           


                 ...

           

         

    ...

    


### Javascript

If necessary, this code will prevent unexpected menu close when using some components (like accordion, forms, etc)

    $(document).on('click', '.yamm .dropdown-menu', function(e) {

       e.stopPropagation()

    })

### AngularJS

Check it at [hjzheng/angular-mega-menu](https://github.com/hjzheng/angular-mega-menu)

### Bugs and feature requests

Please first read the [issue guidelines](https://github.com/geedmo/yamm3/blob/master/.github/CONTRIBUTING.md) and search for existing and closed issues. If your problem or idea is not addressed yet, [please open a new issue](https://github.com/geedmo/yamm3/issues/new).

### Compile

Run the following commands in the repository folder

- npm install

- gulp

To compile yamm with demo

- gulp demo

### License

- Licenced under MIT - [details here](LICENSE.txt)

## Sponsored content