Skip to content

Commit 09b638c

Browse files
CodeHimBlogCodeHimBlog
authored
Update index.html
1 parent 6625db6 commit 09b638c

File tree

1 file changed

+6
-264
lines changed

1 file changed

+6
-264
lines changed

‎index.html

Lines changed: 6 additions & 264 deletions
Original file line numberDiff line numberDiff line change
@@ -3,273 +3,15 @@
33
<head>
44
<meta name="viewport" content="width=device-width, initial-scale=1" />
55
<meta charset="UTF-8" />
6-
<title> jQuery Responsive jSide Menu with Dropdowns - Plugin by Asif Mughal </title>
7-
<meta name="description" content="jSide Menu is a free jQuery menu plugin that helps you create side vertical navigation menu with dropdowns, fully responsive and customizable." />
8-
9-
<!--Google Fonts-->
10-
<link href="https://fonts.googleapis.com/css?family=Hind|Oxygen" rel="stylesheet" />
11-
<!--jQuery-->
12-
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
13-
<!--Material Design Iconic Font-->
14-
<link rel="stylesheet" href="material-design/css/material-design-iconic-font.css" />
15-
16-
<!--jSide Menu Plugin-->
17-
<script src="js/jquery.jside.menu.js"></script>
18-
<!--jSide Menu CSS-->
19-
<link rel="stylesheet" href="css/jside-menu.css" />
20-
<!--jSide Skins-->
21-
<link rel="stylesheet" href="css/jside-skins.css" />
22-
23-
<script>
24-
$(document).ready(function(){
25-
26-
$(".menu-container").jSideMenu({
27-
jSidePosition: "position-left", //possible options position-left or position-right
28-
29-
jSideSticky: true, // menubar will be fixed on top, false to set static
30-
31-
jSideSkin: "default-skin", // to apply custom skin, just put its name in this string
32-
});
33-
});
34-
</script>
6+
<meta http-equiv="refresh" content="0;URL='https://www.codehim.com/demo/jquery-jside-menu/'">
7+
<script type="text/javascript">
8+
window.location.href='https://www.codehim.com/demo/jquery-jside-menu/';
9+
</script>
3510

3611
</head>
3712
<body>
38-
39-
<menu class="menubar">
40-
<menuitem>
41-
<button class="menu-trigger"> </button>
42-
</menuitem>
43-
44-
<menuitem class="logo" title="Your Logo Goes Here">
45-
<a href="#1"><img src="image/jside-menu.png" alt="jSide Menu" /> </a>
46-
</menuitem>
47-
</menu>
48-
49-
50-
<div class="menu-head">
51-
<span class="layer">
52-
<div class="col">
53-
<div class="row for-pic">
54-
<div class="profile-pic">
55-
<img src="image/asif-mughal.jpg" alt="Asif Mughal" />
56-
</div>
57-
</div>
58-
<div class="row for-name">
59-
<h3 title="User Name"> Asif Mughal </h3>
60-
<span class="tagline"> Tagline text goes here</span>
61-
</div>
62-
</div> <!--//col-->
63-
</span>
64-
</div> <!--//menu-head-->
65-
66-
<nav class="menu-container">
67-
68-
<ul class="menu-items">
69-
<li><span class="item-icon"><i class="zmdi zmdi-android"></i></span> <a href="#1">
70-
Main item one </a></li>
71-
72-
<li> <span class="item-icon"> <i class="zmdi zmdi-apple"></i> </span> <a href="#1">
73-
Main item two </a></li>
74-
75-
<li class="has-sub"> <span class="item-icon"> <i class="zmdi zmdi-windows"></i> </span>
76-
<span class="dropdown-heading">
77-
Item three with dropdown </span>
78-
<ul>
79-
<li> <a href="#2">dropdown sub item 1 </a> </li>
80-
<li> <a href="#2"> dropdown sub item 2 </a> </li>
81-
<li> <a href="#2"> dropdown sub item 3 </a> </li>
82-
<li> <a href="#2"> dropdown sub item 4 </a> </li>
83-
<li> <a href="#2"> dropdown sub item 5 </a> </li>
84-
<li> <a href="#2"> dropdown sub item 6 </a> </li>
85-
<li> <a href="#2"> dropdown sub item 7 </a> </li>
86-
</ul>
87-
</li>
88-
<li class="has-sub"> <span class="item-icon"> <i class="zmdi zmdi-devices"></i> </span>
89-
<span class="dropdown-heading">
90-
91-
Item four with dropdown </span>
92-
<ul>
93-
<li> <a href="#2">sub item 1 </a> </li>
94-
<li> <a href="#2">sub item 2 </a> </li>
95-
<li> <a href="#2">sub item 3 </a> </li>
96-
<li> <a href="#2">sub item 4 </a> </li>
97-
</ul>
98-
</li>
99-
100-
<li> <span class="item-icon"> <i class="zmdi zmdi-keyboard"></i> </span> <a href="#1">
101-
Main item four </a></li>
102-
103-
<li> <span class="item-icon"> <i class="zmdi zmdi-dock"></i> </span> <a href="#1">
104-
Main item five </a></li>
105-
106-
<li> <span class="item-icon"> <i class="zmdi zmdi-mouse"></i> </span> <a href="#1">
107-
Main item five </a></li>
108-
109-
<li> <span class="item-icon"> <i class="zmdi zmdi-tv"></i> </span> <a href="#1">
110-
Main item six </a></li>
111-
112-
</ul>
113-
114-
115-
</nav>
116-
<div class="dim-overlay"></div>
117-
118-
<!--End jSide Menu-->
119-
120-
121-
122-
123-
<!--Introduction and Demo Only -->
124-
<header class="intro">
125-
<h1>jQuery Responsive jSide Menu with Dropdowns</h1>
126-
<p>
127-
jSide Menu is a well designed, simple and clean side navigation menu with dropdowns.
128-
<br />
129-
<br />
130-
<b> Written in:</b><i> HTML, CSS, JS</i><br>
131-
<b> Frameworks: </b> <i> jQuery 3.3.1 &amp; Material-Design-Iconic-Font 2.0 </i>
132-
</p>
133-
<div class="action">
134-
<a class="btn github" href="https://github.com/CodeHimBlog/jquery-jside-menu"> Fork on GiHub </a>
135-
<a class="btn down" href="https://github.com/CodeHimBlog/jquery-jside-menu/archive/master.zip">Download </a>
136-
<div style="margin-left:auto;margin-right:auto">
137-
<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
138-
<!-- textAd -->
139-
<ins class="adsbygoogle"
140-
style="display:inline-block;width:320px;height:100px"
141-
data-ad-client="ca-pub-7089100907045419"
142-
data-ad-slot="8115428124"></ins>
143-
<script>
144-
(adsbygoogle = window.adsbygoogle || []).push({});
145-
</script>
146-
</div>
147-
</div>
148-
</header>
149-
150-
151-
<main>
152-
<article>
153-
154-
<h2> Main Features </h2>
155-
<ul>
156-
<li>Fully Responsive and Customizable.</li>
157-
<li>Unlimited main items and sub items can be added. </li>
158-
<li>Sticky Profile.</li>
159-
<li> CSS3 and jQuery Animations Enabled. </li>
160-
<li>Material Design Iconic Fonts. </li>
161-
<li> Background dim-overlay when menu open </li>
162-
<li> Chrome, Safari, Firefox, Opera, IE7+, IOS, Android and windows phone supported. </li>
163-
<li> User Friendly and Easy to Implement. </li>
164-
</ul>
165-
166-
167-
168-
169-
170-
<h2> Save Time to Quickly Customize </h2>
171-
<p>
172-
You can highly customize this navigation system without investing time in modifications of code.
173-
</p>
174-
175-
<h3> 1. jSide Menu Skin </h3>
176-
177-
<p> Choose the theme for the menu: </p>
178-
179-
<div class="theme-tray">
180-
<section class="pl-color">
181-
<h4> Plain Color</h4>
182-
<span title="Love Red" class="red"> </span>
183-
<span title="Clover Green" class="green"> </span>
184-
<span title="Dodger Blue" class="blue"> </span>
185-
<span title="Bright Neon Pink" class="bnp"> </span>
186-
<span title="Pumpkin Orange" class="orange"> </span>
187-
<span title="Black" class="black"> </span>
188-
<span title="Neon Pink" class="pink"> </span>
189-
<span title="Golden Brown" class="gol-b"> </span>
190-
<span title="Greenish Blue" class="greenish"> </span>
191-
<span title="Wood" class="wood"> </span>
192-
</section>
193-
<!--Do not Remove The following Ad Unit if you distribute this Plugin to others-->
194-
<div style="margin: 10px;">
195-
<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
196-
<ins class="adsbygoogle"
197-
style="display:block; text-align:center;"
198-
data-ad-layout="in-article"
199-
data-ad-format="fluid"
200-
data-ad-client="ca-pub-7089100907045419"
201-
data-ad-slot="7782420780"></ins>
202-
<script>
203-
(adsbygoogle = window.adsbygoogle || []).push({});
204-
</script>
205-
</div>
206-
<section class="gr-color">
207-
<h4> Gradient Color</h4>
208-
<span title="Flickr" class="flickr"> </span>
209-
<span title="Facebook Messenger" class="fb-messenger"> </span>
210-
<span title="Moonlit Asteroid" class="moonlit"> </span>
211-
<span title="Park Life" class="park-life"> </span>
212-
<span title="Dance to Forget" class="d2f"> </span>
213-
<span title="Man of the Steel" class="steel-man"> </span>
214-
<span title="Amethyst" class="amethyst"> </span>
215-
<span title="Between the Clouds" class="between-clouds"> </span>
216-
<span title="Crazy Orange"class="crazy-orange"> </span>
217-
<span title="Endless River" class="endless-river"> </span>
218-
</section>
219-
</div>
220-
<!--//theme-tray-->
221-
222-
<h3>2. Menubar Position</h3>
223-
<p> Choose the menubar position:</p>
224-
<ol>
225-
<li> <input type="radio" id="set-top" name="radio" checked/> Fixed on Top </li>
226-
<li> <input type="radio" name="radio" id="set-st"/> Static </li>
227-
228-
</ol>
229-
230-
<h3>3. Menu Container Position </h3>
231-
<p> Choose the suitable position for menu container. </p>
232-
<select class="menu-position">
233-
<option> position-left </option>
234-
<option> position-right </option>
235-
</select>
236-
237-
<h2>Generated Script</h2>
238-
<p>
239-
Copy and paste it into document ready function.
240-
</p>
241-
<pre class="prettyprint">
242-
$(".menu-container").jSideMenu({
243-
<span class="j-pos">jSidePosition: "position-left",</span>
244-
<span class="j-sticky">jSideSticky: true, </span>
245-
<span class="j-skin">jSideSkin: "default-skin", </span>
246-
});
247-
</pre>
248-
249-
250-
<h2> Browsers Compatability</h2>
251-
<p>Best view on Google Chrome, Firefox, Opera and UC Desktop Browser</p>
252-
253-
254-
</p>
255-
256-
257-
</article>
258-
259-
</main>
260-
261-
262-
263-
<!--DEMO ONLY FILES-->
264-
<!--Demo CSS-->
265-
<link rel="stylesheet" href="docs/demo-only.css" />
266-
<script src="docs/demo-only.js"></script>
267-
268-
269-
270-
<footer class="credit">
271-
Coded with <span title="Coffee"></span> by Asif Mughal &copy; 2018 - <a href="https://www.codehim.com" rel="dofollow" title="Awesome Web Projects and Tutorials" target="_blank"> Codehim.com </a>
272-
</footer>
13+
<h2> Page Moved</h2>
14+
<p>This page has been moved to moved to <a href="https://www.codehim.com/demo/jquery-jside-menu/">https://www.codehim.com/demo/jquery-jside-menu/</a> </p>
27315

27416
</body>
27517
</html>

0 commit comments

Comments
 (0)