https://github.com/adityasrivast/allcollapsible
one collapsible for all
https://github.com/adityasrivast/allcollapsible
collapsible collapsible-extensible collapsible-with-arrows dev-tool front-end menu responsive
Last synced: 10 months ago
JSON representation
one collapsible for all
- Host: GitHub
- URL: https://github.com/adityasrivast/allcollapsible
- Owner: AdityaSrivast
- License: mit
- Created: 2018-04-07T20:15:02.000Z (almost 8 years ago)
- Default Branch: master
- Last Pushed: 2022-05-07T14:10:32.000Z (almost 4 years ago)
- Last Synced: 2025-03-10T23:52:35.104Z (11 months ago)
- Topics: collapsible, collapsible-extensible, collapsible-with-arrows, dev-tool, front-end, menu, responsive
- Homepage: https://www.jsdelivr.com/package/gh/adityasrivast/allcollapsible
- Size: 27.3 KB
- Stars: 6
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md
- License: LICENSE.md
Awesome Lists containing this project
README
# AllCollapsible
*one collapsible for all*
[](https://badge.fury.io/gh/AdityaSrivast%2FAllCollapsible)
[](https://badge.fury.io/js/allcollapsible)
[](https://david-dm.org/adityasrivast/AllCollapsible)
[](https://www.jsdelivr.com/package/gh/adityasrivast/allcollapsible)
### DEMO:
https://adityasrivast.github.io/AllCollapsible/demo/example.html
## QUICKSTART:
- [Download the latest release](https://github.com/AdityaSrivast/AllCollapsible/releases/latest) of AllCollapsible directly from GitHub.
- Clone the repo: `git clone https://github.com/AdityaSrivast/AllCollapsible.git`
- Include the files via [jsDelivr](https://www.jsdelivr.com/package/gh/adityasrivast/allcollapsible).
- Install with [npm](https://www.npmjs.com): `npm install allcollapsible`
## CDN:
Just add the link to the files in your `` tag.
```html
```
Apart from these don't forget to add cdn for jquery before `` tag for js file.
```html
<script src="https://cdn.jsdelivr.net/gh/jquery/jquery@3/dist/jquery.min.js">
```
## USAGE:
### Default
```html
-
First
Lorem ipsum dolor sit amet.
-
Second
Lorem ipsum dolor sit amet
-
Third
Lorem ipsum dolor sit amet
```
### Extensible
```html
-
First
Lorem ipsum dolor sit amet.
-
Second
Lorem ipsum dolor sit amet
-
Third
Lorem ipsum dolor sit amet
```
### Collapsible With Arrows
#### Default
```html
-
First
Lorem ipsum dolor sit amet.
-
Second
Lorem ipsum dolor sit amet
-
Third
Lorem ipsum dolor sit amet
```
#### Extensible
```html
-
First
Lorem ipsum dolor sit amet.
-
Second
Lorem ipsum dolor sit amet
-
Third
Lorem ipsum dolor sit amet
```
Similar format is to be followed for classes: `with-plus`,`with-vertical-bar`,`with-star`,`with-pencil`,`with-bullets`,`with-pointer`,`with-caret`,`with-right-caret`.
For Demo of these classes, [click here](https://adityasrivast.github.io/AllCollapsible/demo/example.html).
### Coloured Collapsible
You can even beautify the title and body for the collapsible by adding colours to it. The only thing you have to do is add a class to `
For Example:
```html
-
First
Lorem ipsum dolor sit amet
-
Second
Lorem ipsum dolor sit amet
-
```
The colours available are: red, pink, purple, deep-purple, indigo, blue, light-blue, cyan, teal, green, light-green, lime, yellow, amber, orange, deep-orange, available in 10 shades of each, viz., base-color, color-lighten-1, color-lighten-2, color-lighten-3, color-lighten-4, color-lighten-5, color-accent-1, color-accent-2, color-accent-3, color-accent-4. In addition, colours, brown, grey, blue-grey are also available, with 6 six shades each, viz., base-color, color-lighten-1, color-lighten-2, color-lighten-3, color-lighten-4, color-lighten-5.
### Special Effects
In addition to these, special effects for hover on `collapsible title` can be used.
For hover, two effects can be used: fade-in and fade-out. Correspondingly, two classes, `fadein-effect` and(or) `fadeout-effect` need to be added to `
- ` tag.
### BUGS
For any bugs or issue, report at:
https://github.com/AdityaSrivast/AllCollapsible/issues
You may also mail at:
[adityasrivast.dev@gmail.com](mailto:adityasrivast.dev@gmail.com)
### DEPENDENCIES
JQuery 1.4 or higher
### LICENSE
MIT License
Copyright (c) 2018 Aditya Srivastava