Skip to content
This repository

HTTPS clone URL

Subversion checkout URL

You can clone with HTTPS or Subversion.

Download ZIP
Newer
Older
100644 89 lines (76 sloc) 1.654 kb
53966a5a »
2011-10-09 Updated readme.
1 ### Usage
3af4c6e2 »
2010-06-17 Added content to README.
2
53966a5a »
2011-10-09 Updated readme.
3 ### Basic options
ccb450b8 »
2011-09-27 Fixed syntax highlighting.
4
5 ```javascript
6 $('#container').stickySectionHeaders();
7 ```
4803b957 »
2010-06-17 Added demo link and removed target div from index.html.
8
56e91ee0 »
2011-10-09 Edited README.markdown via GitHub
9 Check out the [demo here](http://polarblau.github.com/stickySectionHeaders/).
ccb450b8 »
2011-09-27 Fixed syntax highlighting.
10
53966a5a »
2011-10-09 Updated readme.
11 ### Settings and defaults
ccb450b8 »
2011-09-27 Fixed syntax highlighting.
12
13 ```javascript
14 $('#container').stickySectionHeaders({
15 stickyClass : 'sticky',
16 headlineSelector : 'strong'
17 });
18 ```
19
53966a5a »
2011-10-09 Updated readme.
20 ### HTML
ccb450b8 »
2011-09-27 Fixed syntax highlighting.
21
22 ```html
23 <div id="container">
24 <ul class="sections">
25 <li>
26 <strong>Section Headline 1</strong>
27 <ul>
28 <li id="id-1">Content line</li>
29 <li id="id-2">Content line</li>
30 <li id="id-3">Content line</li>
31 <li id="id-4">Content line</li>
32 </ul>
33 </li>
34 <li>
35 <strong>Section Headline 2</strong>
36 <ul>
37 <li id="id-5">Content line</li>
38 <li id="id-6">Content line</li>
39 </ul>
40 </li>
41 <li>
42 <strong>Section Headline 4</strong>
43 <ul>
44 <li id="id-14">Content line</li>
45 <li id="id-15">Content line</li>
46 <li id="id-16">Content line</li>
47 <li id="id-17">Content line</li>
48 </ul>
49 </li>
50 </ul>
51 </div>
ae0f89b7 »
2011-10-09 Updated readme.
52 ```
53
53966a5a »
2011-10-09 Updated readme.
54 ### CSS
ae0f89b7 »
2011-10-09 Updated readme.
55
56 ```css
57 /* Reset some list defaults for all lists */
58 ul {
59 list-style: none;
60 margin: 0;
61 padding: 0;
62 }
63
64 /* The main container */
65 #sticky-list {
66 height: 100px;
67 overflow: hidden;
68 position: relative;
69 }
70
71 /* The main list */
72 #sticky-list > ul {
73 height: 100%;
74 overflow: auto;
75 }
76
77 /* Section headers, defined through "headlineSelector" */
78 #sticky-list > ul > li strong {
79 display: block;
80 }
81
82 /* Section headers when "sticky", defined through "stickyClass" */
83 #sticky-list > ul > li.sticky strong {
84 position: absolute;
85 left: 0;
86 right: 0;
87 top: 0;
88 }
ccb450b8 »
2011-09-27 Fixed syntax highlighting.
89 ```
Something went wrong with that request. Please try again.