1
+ <!DOCTYPE html>
2
+ < html lang ="en ">
3
+ < head >
4
+ < meta charset ="UTF-8 ">
5
+ < meta name ="viewport " content ="width=device-width, initial-scale=1.0 ">
6
+ < title > A Contained Fixed Positioned Sticky Sidebar jQuery Plugin.</ title >
7
+ < meta name ="description " content ="stickymojo by mojotech. A contained fixed positioned sticky sidebar jQuery plugin. ">
8
+ < meta name ="author " content ="mojotech ">
9
+ < meta name ="robots " content ="index, follow ">
10
+ <!-- Canonical URL -->
11
+ < link rel ="canonical " href ="https://codehimblog.github.io/jquery-plugins/stickymojo-by-mojotech.html ">
12
+ <!-- Favicon -->
13
+ < link rel ="icon " href ="/favicon.ico " type ="image/png ">
14
+ <!-- Bootstrap CSS -->
15
+ < link href ="
https://cdn.jsdelivr.net/npm/[email protected] /dist/css/bootstrap.min.css "
rel ="
stylesheet "
>
16
+ <!-- Bootstrap Icons -->
17
+ < link href ="https://cdn.jsdelivr.net/npm/bootstrap-icons/font/bootstrap-icons.css " rel ="stylesheet ">
18
+ < link rel ="stylesheet " href ="/css/styles.css ">
19
+ </ head >
20
+ < body >
21
+ <!-- Navbar -->
22
+ < nav class ="navbar navbar-expand-lg navbar-dark bg-dark fixed-top ">
23
+ < div class ="container ">
24
+ < a class ="navbar-brand " href ="https://codehimblog.github.io ">
25
+ < i class ="bi bi-box-seam me-2 "> </ i > CodehimBlog
26
+ </ a >
27
+ < button class ="navbar-toggler " type ="button " data-bs-toggle ="collapse " data-bs-target ="#navbarNav " aria-controls ="navbarNav " aria-expanded ="false " aria-label ="Toggle navigation ">
28
+ < span class ="navbar-toggler-icon "> </ span >
29
+ </ button >
30
+ < div class ="collapse navbar-collapse " id ="navbarNav ">
31
+ < ul class ="navbar-nav ms-auto ">
32
+ < li class ="nav-item ">
33
+ < a class ="nav-link " href ="https://codehimblog.github.io/ "> < i class ="bi bi-house-door me-1 "> </ i > Home</ a >
34
+ </ li >
35
+ < li class ="nav-item ">
36
+ < a class ="nav-link " href ="https://codehimblog.github.io/projects/ "> < i class ="bi bi-box me-1 "> </ i > Projects</ a >
37
+ </ li >
38
+ < li class ="nav-item ">
39
+ < a class ="nav-link " href ="https://codehimblog.github.io/about.html "> < i class ="bi bi-book me-1 "> </ i > About</ a >
40
+ </ li >
41
+ < li class ="nav-item ">
42
+ < a class ="nav-link " href ="https://codehimblog.github.io/contact.html "> < i class ="bi bi-envelope me-1 "> </ i > Contact</ a >
43
+ </ li >
44
+ </ ul >
45
+ </ div >
46
+ </ div >
47
+ </ nav >
48
+
49
+ <!-- Breadcrumbs -->
50
+ < div class ="container mt-4 breadcrumbs ">
51
+ < nav aria-label ="breadcrumb ">
52
+ < ol class ="breadcrumb mb-0 ">
53
+ < li class ="breadcrumb-item "> < a href ="https://codehimblog.github.io/ "> Home</ a > </ li >
54
+ < li class ="breadcrumb-item "> < a href ="https://codehimblog.github.io/jquery-plugins/ "> jQuery Plugins</ a > </ li >
55
+ < li class ="breadcrumb-item active " aria-current ="page "> Stickymojo</ li >
56
+ </ ol >
57
+ </ nav >
58
+ </ div >
59
+
60
+ <!-- Schema Markup for Breadcrumbs -->
61
+ < script type ="application/ld+json ">
62
+ {
63
+ "@context" : "https://schema.org" ,
64
+ "@type" : "BreadcrumbList" ,
65
+ "itemListElement" : [
66
+ {
67
+ "@type" : "ListItem" ,
68
+ "position" : 1 ,
69
+ "name" : "Home" ,
70
+ "item" : "https://codehimblog.github.io/"
71
+ } ,
72
+ {
73
+ "@type" : "ListItem" ,
74
+ "position" : 2 ,
75
+ "name" : "jQuery Plugins" ,
76
+ "item" : "https://codehimblog.github.io/jquery-plugins/"
77
+ } ,
78
+ {
79
+ "@type" : "ListItem" ,
80
+ "position" : 3 ,
81
+ "name" : "Stickymojo" ,
82
+ "item" : "https://codehimblog.github.io/projects/{{packageSlug}}"
83
+ }
84
+ ]
85
+ }
86
+ </ script >
87
+ <!-- Main Content -->
88
+ < div class ="container mt-3 ">
89
+ < div class ="row ">
90
+ <!-- Main Details -->
91
+ < main class ="col-md-8 site-main p-0 ">
92
+ < article >
93
+ <!-- Project Name & Description -->
94
+ < h1 id ="packageName "> Stickymojo</ h1 >
95
+ < p id ="packageDescription " class ="text-muted "> A contained fixed positioned sticky sidebar jQuery plugin.</ p >
96
+
97
+
98
+
99
+ <!-- Statistics -->
100
+ < div class ="stat-row d-flex justify-content-around align-items-center text-center mb-2 ">
101
+ < div class ="stat-box d-flex align-items-center flex-column-mobile ">
102
+ < i class ="bi bi-star-fill text-warning mb-2 "> </ i >
103
+ < div >
104
+ < span id ="stargazersCount " class ="stat-value "> 401</ span >
105
+ < p class ="stat-label mb-0 "> Stars</ p >
106
+ </ div >
107
+ </ div >
108
+
109
+ < div class ="stat-box d-flex align-items-center flex-column-mobile ">
110
+ < i class ="bi bi-box-arrow-in-down mb-2 "> </ i >
111
+ < div >
112
+ < span id ="repoSize " class ="stat-value "> 0.04 MB</ span >
113
+ < p class ="stat-label mb-0 "> Size</ p >
114
+ </ div >
115
+ </ div >
116
+
117
+ < div class ="stat-box d-flex align-items-center flex-column-mobile ">
118
+ < i class ="bi bi-arrow-repeat text-secondary mb-2 "> </ i >
119
+ < div >
120
+ < span id ="forksCount " class ="stat-value "> 78</ span >
121
+ < p class ="stat-label mb-0 "> Forks</ p >
122
+ </ div >
123
+ </ div >
124
+
125
+ < div class ="stat-box d-flex align-items-center flex-column-mobile ">
126
+ < i class ="bi bi-exclamation-circle text-danger mb-2 "> </ i >
127
+ < div >
128
+ < span id ="openIssuesCount " class ="stat-value "> 6</ span >
129
+ < p class ="stat-label mb-0 "> Open Issues</ p >
130
+ </ div >
131
+ </ div >
132
+ </ div >
133
+
134
+
135
+ < div class ="ad-unit ad-apt ">
136
+ < script async src ="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-7089100907045419 "
137
+ crossorigin ="anonymous "> </ script >
138
+ <!-- CodehimBlog APT -->
139
+ < ins class ="adsbygoogle "
140
+ style ="display:block "
141
+ data-ad-client ="ca-pub-7089100907045419 "
142
+ data-ad-slot ="4990741913 "
143
+ data-ad-format ="auto "
144
+ data-full-width-responsive ="true "> </ ins >
145
+ < script >
146
+ ( adsbygoogle = window . adsbygoogle || [ ] ) . push ( { } ) ;
147
+ </ script >
148
+ </ div >
149
+
150
+ < div class ="row mb-4 ">
151
+ <!-- Tabs (Left) -->
152
+ < div class ="col-12 col-md-6 d-flex justify-content-start mb-3 mb-md-0 ">
153
+ < ul class ="nav nav-tabs " id ="infoTabs " role ="tablist ">
154
+ < li class ="nav-item " role ="presentation ">
155
+ < button class ="nav-link active " id ="installation-tab " data-bs-toggle ="tab " data-bs-target ="#installation " type ="button " role ="tab " aria-controls ="installation " aria-selected ="true ">
156
+ < i class ="bi bi-file-earmark-text "> </ i > Readme
157
+ </ button >
158
+ </ li >
159
+ < li class ="nav-item " role ="presentation ">
160
+ < button class ="nav-link " id ="changelog-tab " data-bs-toggle ="tab " data-bs-target ="#changelog " type ="button " role ="tab " aria-controls ="changelog " aria-selected ="false ">
161
+ < i class ="bi bi-journal-text me-2 "> </ i > Changelog
162
+ </ button >
163
+ </ li >
164
+ </ ul >
165
+ </ div >
166
+
167
+ <!-- Action Buttons (Right) -->
168
+ < div class ="col-12 col-md-6 d-flex align-items-center justify-content-end ">
169
+ < a href ="https://github.com/mojotech/stickymojo/archive/refs/heads/master.zip " class ="btn btn-primary me-2 action-btn " id ="downloadBtn ">
170
+ < i class ="bi bi-cloud-download me-2 "> </ i > Download ZIP
171
+ </ a >
172
+ < a href ="https://github.com/mojotech/stickymojo " target ="_blank " class ="btn btn-outline-secondary action-btn " id ="githubBtn ">
173
+ < i class ="bi bi-github me-2 "> </ i > Fork on GitHub
174
+ </ a >
175
+ </ div >
176
+ </ div >
177
+ < div class ="tab-content mt-3 " id ="infoTabsContent ">
178
+ < div class ="tab-pane fade show active " id ="installation " role ="tabpanel " aria-labelledby ="installation-tab ">
179
+ < h1 > stickyMojo</ h1 >
180
+ < p > stickyMojo is a contained sticky sidebar plugin for jQuery. It's lightweight, fast, flexible and compatible with Firefox, Chrome, Safari, and IE8+. It will degrade gracefully in older versions of IE. < a href ="http://mojotech.github.com/stickymojo/ "> Here are the instructions</ a > .</ p >
181
+ < h1 > Credits</ h1 >
182
+ < p > < a href ="http://www.mojotech.com "> < img src ="http://www.mojotech.com/press/logo.png " alt ="MojoTech " /> </ a > </ p >
183
+ < h1 > License</ h1 >
184
+ < p > stickyMojo is Copyright © 2014 MojoTech, LLC. It is free software, and may be redistributed under the terms specified in the LICENSE file.</ p >
185
+ </ div >
186
+
187
+ < div class ="tab-pane fade " id ="changelog " role ="tabpanel " aria-labelledby ="changelog-tab ">
188
+ < ul id ="changelogList ">
189
+ No changelog available.
190
+ </ ul >
191
+ </ div >
192
+
193
+ </ div >
194
+
195
+ < div class ="tags mb-2 mt-2 ">
196
+ < a href ="https://codehimblog.github.io/tag/jquery " class ="text-decoration-none ">
197
+ < div class ="d-inline-flex align-items-center bg-light border rounded-pill px-3 py-1 me-2 mb-2 ">
198
+ < i class ="bi bi-tag-fill me-2 "> </ i >
199
+ < span > jquery</ span >
200
+ </ div >
201
+ </ a > < a href ="https://codehimblog.github.io/tag/plugin " class ="text-decoration-none ">
202
+ < div class ="d-inline-flex align-items-center bg-light border rounded-pill px-3 py-1 me-2 mb-2 ">
203
+ < i class ="bi bi-tag-fill me-2 "> </ i >
204
+ < span > plugin</ span >
205
+ </ div >
206
+ </ a > < a href ="https://codehimblog.github.io/tag/sticky " class ="text-decoration-none ">
207
+ < div class ="d-inline-flex align-items-center bg-light border rounded-pill px-3 py-1 me-2 mb-2 ">
208
+ < i class ="bi bi-tag-fill me-2 "> </ i >
209
+ < span > sticky</ span >
210
+ </ div >
211
+ </ a >
212
+ </ div >
213
+
214
+ </ article >
215
+
216
+
217
+ </ main >
218
+ <!-- Sidebar -->
219
+ < aside class ="col-md-4 p-0 ">
220
+ < div class ="sidebar ">
221
+ <!-- Owner Section -->
222
+ < div class ="sidebar-item mb-4 ">
223
+ < div class ="ad-unit ">
224
+ < script async src ="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-7089100907045419 "
225
+ crossorigin ="anonymous "> </ script >
226
+ <!-- CodehimBlog Sidebar -->
227
+ < ins class ="adsbygoogle "
228
+ style ="display:block "
229
+ data-ad-client ="ca-pub-7089100907045419 "
230
+ data-ad-slot ="8929986923 "
231
+ data-ad-format ="auto "
232
+ data-full-width-responsive ="true "> </ ins >
233
+ < script >
234
+ ( adsbygoogle = window . adsbygoogle || [ ] ) . push ( { } ) ;
235
+ </ script >
236
+ </ div >
237
+ < div class ="d-flex align-items-center ">
238
+ < img src ="https://avatars.githubusercontent.com/u/314035?v=4 " alt ="Owner Avatar " class ="rounded-circle me-2 owner-avatar ">
239
+ < a href ="https://github.com/mojotech " target ="_blank " id ="ownerName " class ="sidebar-link "> mojotech</ a >
240
+ </ div >
241
+ </ div >
242
+
243
+ <!-- Metadata Section -->
244
+ < div class ="sidebar-item mb-2 ">
245
+ < div class ="metadata-item d-flex align-items-center ">
246
+ < i class ="bi bi-calendar me-2 "> </ i >
247
+ < strong > Created At:</ strong >
248
+ < span id ="createdAt " class ="ms-1 "> July 13, 2012</ span >
249
+ </ div >
250
+ < div class ="metadata-item d-flex align-items-center mt-2 ">
251
+ < i class ="bi bi-pencil-square me-2 "> </ i >
252
+ < strong > Last Updated:</ strong >
253
+ < span id ="updatedAt " class ="ms-1 "> February 6, 2024</ span >
254
+ </ div >
255
+ < div class ="metadata-item d-flex align-items-center mt-2 ">
256
+ < i class ="bi bi-file-earmark-code me-2 "> </ i >
257
+ < strong > Language:</ strong >
258
+ < span id ="language " class ="ms-1 "> JavaScript</ span >
259
+ </ div >
260
+
261
+ < div class ="metadata-item d-flex align-items-center mt-2 ">
262
+ < i class ="bi bi-shield-check "> </ i >
263
+ < strong > License:</ strong >
264
+ < span id ="license " class ="ms-1 "> Other</ span >
265
+ </ div >
266
+ < a href ="http://mojotech.github.com/stickymojo/ " target ="_blank " class ="btn btn-outline-dark btn-sm " id ="homepageBtn ">
267
+ < i class ="bi bi-house-door me-2 "> </ i > Visit Homepage
268
+ </ a >
269
+
270
+ </ div >
271
+
272
+ < div class ="sidebar-item mb-2 ">
273
+
274
+ </ div >
275
+
276
+ < div class ="sidebar-item ">
277
+ < h5 class ="sidebar-title "> Contributors</ h5 >
278
+ < ul class ="p-0 " id ="contributorsList ">
279
+ < ul class ="list-group list-group-flush " id ="contributorsList "> < li class ="list-group-item d-flex align-items-center contributor-item "> < img src ="https://avatars.githubusercontent.com/u/883126?v=4 " alt ="samccone " class ="rounded-circle me-3 " style ="width: 40px; height: 40px; "> < div > < a href ="https://github.com/samccone " target ="_blank " class ="text-decoration-none fw-bold "> samccone</ a > < p class ="mb-0 text-muted small "> 6 contributions</ p > </ div > </ li > < li class ="list-group-item d-flex align-items-center contributor-item "> < img src ="https://avatars.githubusercontent.com/u/1904129?v=4 " alt ="aesnyder " class ="rounded-circle me-3 " style ="width: 40px; height: 40px; "> < div > < a href ="https://github.com/aesnyder " target ="_blank " class ="text-decoration-none fw-bold "> aesnyder</ a > < p class ="mb-0 text-muted small "> 4 contributions</ p > </ div > </ li > < li class ="list-group-item d-flex align-items-center contributor-item "> < img src ="https://avatars.githubusercontent.com/u/863?v=4 " alt ="cpjolicoeur " class ="rounded-circle me-3 " style ="width: 40px; height: 40px; "> < div > < a href ="https://github.com/cpjolicoeur " target ="_blank " class ="text-decoration-none fw-bold "> cpjolicoeur</ a > < p class ="mb-0 text-muted small "> 4 contributions</ p > </ div > </ li > < li class ="list-group-item d-flex align-items-center contributor-item "> < img src ="https://avatars.githubusercontent.com/u/3294430?v=4 " alt ="nareike " class ="rounded-circle me-3 " style ="width: 40px; height: 40px; "> < div > < a href ="https://github.com/nareike " target ="_blank " class ="text-decoration-none fw-bold "> nareike</ a > < p class ="mb-0 text-muted small "> 1 contributions</ p > </ div > </ li > < li class ="list-group-item d-flex align-items-center contributor-item "> < img src ="https://avatars.githubusercontent.com/u/1276622?v=4 " alt ="damiandennis " class ="rounded-circle me-3 " style ="width: 40px; height: 40px; "> < div > < a href ="https://github.com/damiandennis " target ="_blank " class ="text-decoration-none fw-bold "> damiandennis</ a > < p class ="mb-0 text-muted small "> 1 contributions</ p > </ div > </ li > < li class ="list-group-item d-flex align-items-center contributor-item d-none "> < img src ="https://avatars.githubusercontent.com/u/11474654?v=4 " alt ="skotz " class ="rounded-circle me-3 " style ="width: 40px; height: 40px; "> < div > < a href ="https://github.com/skotz " target ="_blank " class ="text-decoration-none fw-bold "> skotz</ a > < p class ="mb-0 text-muted small "> 1 contributions</ p > </ div > </ li > < li class ="list-group-item d-flex align-items-center contributor-item d-none "> < img src ="https://avatars.githubusercontent.com/u/447517?v=4 " alt ="antialias " class ="rounded-circle me-3 " style ="width: 40px; height: 40px; "> < div > < a href ="https://github.com/antialias " target ="_blank " class ="text-decoration-none fw-bold "> antialias</ a > < p class ="mb-0 text-muted small "> 1 contributions</ p > </ div > </ li > < li class ="list-group-item text-center "> < a href ="# " id ="toggleContributors " class ="d-block "> +2 more Contributors</ a > </ li > </ ul >
280
+ </ ul >
281
+
282
+ </ div >
283
+
284
+ < div class ="ad-unit ">
285
+ < script async src ="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-7089100907045419 "
286
+ crossorigin ="anonymous "> </ script >
287
+ <!-- CodehimBlog Skyscrapper -->
288
+ < ins class ="adsbygoogle "
289
+ style ="display:block "
290
+ data-ad-client ="ca-pub-7089100907045419 "
291
+ data-ad-slot ="7469565592 "
292
+ data-ad-format ="auto "
293
+ data-full-width-responsive ="true "> </ ins >
294
+ < script >
295
+ ( adsbygoogle = window . adsbygoogle || [ ] ) . push ( { } ) ;
296
+ </ script >
297
+ </ div >
298
+
299
+ </ div >
300
+ </ aside >
301
+ </ div >
302
+ </ div >
303
+ <!-- Footer -->
304
+ < footer class ="bg-dark text-white text-center py-3 page-footer ">
305
+ < div class ="container ">
306
+ < p class ="mb-2 "> © 2024 CodehimBlog - Powered by GitHub</ p >
307
+ < nav >
308
+ < ul class ="list-inline mb-0 ">
309
+ < li class ="list-inline-item ">
310
+ < a href ="/privacy-policy.html " class ="footer-link "> Privacy Policy</ a >
311
+ </ li >
312
+ < li class ="list-inline-item ">
313
+ < span class ="text-white "> |</ span >
314
+ </ li >
315
+ < li class ="list-inline-item ">
316
+ < a href ="/terms-and-conditions.html " class ="footer-link "> Terms and Conditions</ a >
317
+ </ li >
318
+ </ ul >
319
+ </ nav >
320
+ </ div >
321
+ </ footer >
322
+ <!-- Bootstrap Bundle JS -->
323
+ < script src ="
https://cdn.jsdelivr.net/npm/[email protected] /dist/js/bootstrap.bundle.min.js "
> </ script >
324
+ < script src ="https://cdn.jsdelivr.net/gh/google/code-prettify@master/loader/run_prettify.js "> </ script >
325
+ < script src ="/js/script.js "> </ script >
326
+ <!-- Google tag (gtag.js) -->
327
+ < script async src ="https://www.googletagmanager.com/gtag/js?id=G-FG2ZX76XGT "> </ script >
328
+ < script >
329
+ window . dataLayer = window . dataLayer || [ ] ;
330
+ function gtag ( ) { dataLayer . push ( arguments ) ; }
331
+ gtag ( 'js' , new Date ( ) ) ;
332
+
333
+ gtag ( 'config' , 'G-FG2ZX76XGT' ) ;
334
+ </ script >
335
+ </ body >
336
+ </ html >
0 commit comments