Skip to content

Commit a3284b7

Browse files
author
Kamal Pandey
committed
Merge branch 'release/v1.1.1'
2 parents 4dde637 + 063b24d commit a3284b7

File tree

12 files changed

+445
-1399
lines changed

12 files changed

+445
-1399
lines changed

‎.github/workflows/codeql-analysis.yml

Lines changed: 0 additions & 70 deletions
This file was deleted.

‎.prettierignore

Whitespace-only changes.

‎LICENSE

Lines changed: 0 additions & 21 deletions
This file was deleted.

‎README-BOOTSTRAP-4.md

Lines changed: 116 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,116 @@
1+
# BootNavbar
2+
3+
![license](https://img.shields.io/github/license/kmlpandey77/bootnavbar?style=plastic)
4+
5+
Table of contents:
6+
7+
- [Introduction](#introduction)
8+
- [Preview](#preview)
9+
- [Requirement](#requirement)
10+
- [Download](#Download)
11+
- [BootNavbar CDN](#bootnavbar-cdn)
12+
- [CSS](#css)
13+
- [JS](#js)
14+
- [How to Use](#how-to-use)
15+
- [Options](#options)
16+
17+
## Introduction
18+
19+
> Bootstrap 4 Responsive Navbar with Multi-level Dropdowns \
20+
> This is a fully responsive multilevel dropdown (Treeview menu) navbar opened on hover.
21+
22+
## Preview
23+
24+
![Multi level hover dropdown Navbar for bootstrap 4](https://raw.githubusercontent.com/kmlpandey77/bootnavbar/master/Preview.png "Navbar Preview")
25+
26+
## Requirement
27+
28+
jQuery
29+
boostrap 4
30+
animated.css V3
31+
32+
## Download
33+
34+
[Download source](https://github.com/kmlpandey77/bootnavbar/archive/1.0.2.zip)
35+
36+
## BootNavbar CDN
37+
38+
#### css
39+
40+
```html
41+
<link
42+
rel="stylesheet"
43+
href="https://cdn.jsdelivr.net/gh/kmlpandey77/bootnavbar@1.0.2/css/bootnavbar.css"
44+
/>
45+
```
46+
47+
#### js
48+
49+
```html
50+
<script src="https://cdn.jsdelivr.net/gh/kmlpandey77/bootnavbar@1.0.2/js/bootnavbar.js"></script>
51+
```
52+
53+
## How to use
54+
55+
To use BootNavbar on your website, simply drop the stylesheet into your document's `<head>`.
56+
57+
```html
58+
<head>
59+
<link
60+
rel="stylesheet"
61+
href="https://cdnjs.cloudflare.com/ajax/libs/animate.css/3.7.2/animate.min.css"
62+
/>
63+
<link rel="stylesheet" href="css/bootstrap.min.css" />
64+
<link rel="stylesheet" href="css/bootnavbar.css" />
65+
</head>
66+
```
67+
68+
And, simply drop the JS into your document's `<body>`.
69+
70+
```html
71+
<body>
72+
... ...
73+
74+
<script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
75+
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.3/umd/popper.min.js"></script>
76+
<script src="js/bootstrap.min.js"></script>
77+
<script src="js/bootnavbar.js"></script>
78+
<script>
79+
$(function () {
80+
$("#bootnavbar").bootnavbar({
81+
//options
82+
animation: false,
83+
animateIn: "slideInUp",
84+
});
85+
});
86+
</script>
87+
</body>
88+
```
89+
90+
And, `HTML`.
91+
92+
```html
93+
<nav class="navbar navbar-expand-lg navbar-light bg-light" id="bootnavbar">
94+
... ...
95+
</nav>
96+
```
97+
98+
## Options
99+
100+
**animation**
101+
102+
Type: `Boolean`
103+
104+
Default: `true`
105+
106+
Enable/Disable animation effect
107+
108+
**animateIn**
109+
110+
Type: `String`
111+
112+
Default: `'fadeIn'`
113+
114+
Value: `'slideInUp'`,`'zoomIn'`
115+
116+
View more option in [animate.css](https://daneden.github.io/animate.css)

‎README.md

Lines changed: 58 additions & 65 deletions
Original file line numberDiff line numberDiff line change
@@ -2,122 +2,115 @@
22

33
![license](https://img.shields.io/github/license/kmlpandey77/bootnavbar?style=plastic)
44

5-
Table of contents:
6-
* [Introduction](#introduction)
7-
* [Preview](#preview)
8-
* [Demo](#bootnavbar-demo)
9-
* [Requirement](#requirement)
10-
* [Download](#Download)
11-
* [BootNavbar CDN](#bootnavbar-cdn)
12-
* [CSS](#css)
13-
* [JS](#js)
14-
* [How to Use](#how-to-use)
15-
* [Options](#options)
16-
5+
**Table of contents:**
6+
7+
- [Introduction](#introduction)
8+
- [Preview](#preview)
9+
- [Demo](#bootnavbar-demo)
10+
- [Requirement](#requirement)
11+
- [Download](#Download)
12+
- [BootNavbar CDN](#bootnavbar-cdn)
13+
- [CSS](#css)
14+
- [JS](#js)
15+
- [How to Use](#how-to-use)
16+
- [Options](#options)
1717

1818
## Introduction
1919

20-
> Bootstrap 5 Responsive Navbar with Multi-level Dropdowns \
20+
> Bootstrap 5 Responsive Navbar with Multi-level Dropdowns
2121
> This is a fully responsive multilevel dropdown (Treeview menu) navbar opened on hover.
2222
23-
use [v1.0.2](https://github.com/kmlpandey77/bootnavbar/releases/tag/v1.0.2) for Bootstrap 4
24-
25-
23+
> :warning: **If you are using Boostrap 4** use [v1.0.2](https://github.com/kmlpandey77/bootnavbar/releases/tag/v1.0.2) and read [docs](./README-BOOTSTRAP-4.md)
2624
2725
## Preview
26+
2827
![Multi level hover dropdown Navbar for bootstrap 5](https://raw.githubusercontent.com/kmlpandey77/bootnavbar/master/Preview.png "Navbar Preview")
2928

3029
## BootNavbar Demo
31-
[View Demo](https://kmlpandey77.github.io/bootnavbar)
3230

31+
[View Demo](https://kmlpandey77.github.io/bootnavbar)
3332

3433
## Requirement
35-
boostrap 5
36-
animated.css
34+
35+
- boostrap 5
36+
- animated.css (optional)
3737

3838
## Download
39+
3940
[Download source](https://github.com/kmlpandey77/bootnavbar/archive/refs/tags/v1.1.0.zip)
4041

4142
## BootNavbar CDN
4243

4344
#### css
44-
```html
45-
<link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/kmlpandey77/bootnavbar/css/bootnavbar.css">
4645

46+
```html
47+
<link
48+
rel="stylesheet"
49+
href="https://cdn.jsdelivr.net/gh/kmlpandey77/bootnavbar@v1.1.0/css/bootnavbar.css"
50+
/>
4751
```
4852

4953
#### js
50-
```html
51-
<script src="https://cdn.jsdelivr.net/gh/kmlpandey77/bootnavbar/js/bootnavbar.js"></script>
52-
```
5354

55+
```html
56+
<script src="https://cdn.jsdelivr.net/gh/kmlpandey77/bootnavbar@v1.1.0/js/bootnavbar.js"></script>
57+
```
5458

5559
## How to use
60+
5661
To use BootNavbar on your website, simply drop the stylesheet into your document's `<head>`.
5762

5863
```html
5964
<head>
60-
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/animate.css/3.7.2/animate.min.css">
61-
<link rel="stylesheet" href="css/bootstrap.min.css">
62-
<link rel="stylesheet" href="css/bootnavbar.css">
65+
<link
66+
rel="stylesheet"
67+
href="https://cdnjs.cloudflare.com/ajax/libs/animate.css/4.1.1/animate.min.css"
68+
/>
69+
<link rel="stylesheet" href="css/bootstrap.min.css" />
70+
<link rel="stylesheet" href="css/bootnavbar.css" />
6371
</head>
6472
```
6573

66-
6774
And, simply drop the JS into your document's `<body>`.
6875

6976
```html
7077
<body>
71-
...
72-
...
73-
74-
<script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
75-
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.3/umd/popper.min.js"></script>
76-
<script src="js/bootstrap.min.js"></script>
77-
<script src="js/bootnavbar.js" ></script>
78-
<script>
79-
$(function () {
80-
$('#bootnavbar').bootnavbar({
81-
//options
82-
83-
//animation: false
84-
85-
});
86-
})
87-
</script>
88-
<body>
78+
... ...
79+
80+
<script src="js/bootstrap.min.js"></script>
81+
<script src="js/bootnavbar.js"></script>
82+
<script>
83+
$(function () {
84+
new bootnavbar();
85+
});
86+
</script>
87+
</body>
8988
```
9089

91-
And, `HTML`.
90+
And, `HTML`.
9291

9392
```html
94-
<nav class="navbar navbar-expand-lg navbar-light bg-light" id="bootnavbar">
95-
...
96-
...
93+
<nav class="navbar navbar-expand-lg navbar-light bg-light" id="main_navbar">
94+
... ...
9795
</nav>
9896
```
9997

100-
10198
## Options
10299

103-
**animation**
100+
**Selector**
101+
Key: `selector`
102+
Type: `String`
103+
Default: `main_navbar`
104+
`selector` must be in `id` tag
104105

106+
**Animation**
107+
Key: `animation`
105108
Type: `Boolean`
106-
107109
Default: `true`
108-
109110
Enable/Disable animation effect
110111

111-
112-
113-
**animateIn**
114-
112+
**Animate In**
113+
Key: `animateIn`
115114
Type: `String`
116-
117115
Default: `'fadeIn'`
118-
119-
Value: `'slideInUp'`,`'zoomIn'`
120-
121-
122-
123-
View more option in [animate.css](https://daneden.github.io/animate.css)
116+
Value can be `'slideInUp'`,`'zoomIn'` and for more option visit [animate.css](https://daneden.github.io/animate.css)

0 commit comments

Comments
 (0)