Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/djlechuck/moonav
A tab system for MooTools with transition or not (slide, fade, none).
https://github.com/djlechuck/moonav
Last synced: about 2 months ago
JSON representation
A tab system for MooTools with transition or not (slide, fade, none).
- Host: GitHub
- URL: https://github.com/djlechuck/moonav
- Owner: DjLeChuck
- Created: 2011-03-29T08:10:33.000Z (almost 14 years ago)
- Default Branch: master
- Last Pushed: 2011-04-11T13:52:27.000Z (over 13 years ago)
- Last Synced: 2023-04-22T17:30:21.305Z (over 1 year ago)
- Language: JavaScript
- Homepage: http://djlechuck.github.com/MooNav/
- Size: 191 KB
- Stars: 1
- Watchers: 2
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
MooNav
===========A tab system for MooTools with transition or not (slide, fade, none).
How to use
----------MooTab can be easily use, with just one line! But we also have possibility to customize some points.
There are three ways to do the transition:
- none (default)
- slide (up/down for the moment)
- fadeThere are some examples:
- Basic, without transition effect and the default class
new MooNav();- Custom with slide effect and redefinition of tabs, parts and active class
new MooNav({
tabs: '.onglet_slide',
parts: '.partie_slide',
transition: 'slide',
classActive: 'actif_bis'
});- Custom with fade effect, redefinition of tabs and parts class and custom first active tab
new MooNav({
tabs: '.onglet_fade',
parts: '.partie_fade',
transition: 'fade',
firstActiveTab: 2
});There isn't any other methods to call, all is done!
You can add tabs with the addTab(li_content, div_content).
For example :
myNav = new MooNav();
myNav.addTab("Tab name", "Tab content");Screenshots
-----------![Screenshot 1](http://www.djlechuck.fr/MooNav/Screens/screen1.png)
![Screenshot 2](http://www.djlechuck.fr/MooNav/Screens/screen2.png)
![Screenshot 3](http://www.djlechuck.fr/MooNav/Screens/screen3.png)