Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with
or
.
Download ZIP
Newer
Older
100644 202 lines (198 sloc) 10.678 kB
994dc69 @vitch Added demos with arrows to confirm that that is working with dynamic …
authored
1 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
2 "http://www.w3.org/TR/html4/loose.dtd">
3 <html>
4 <head>
5
6 <title>jScrollPane - settings object documentation</title>
7
8 <!-- styles specific to demo site -->
9 <link type="text/css" href="style/demo.css" rel="stylesheet" media="all" />
10
11 <!-- latest jQuery direct from google's CDN -->
f8e5c97 @vitch Updating the version of jQuery used by the demos to the latest releas…
authored
12 <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
994dc69 @vitch Added demos with arrows to confirm that that is working with dynamic …
authored
13 <!-- scripts specific to this demo site -->
14 <script type="text/javascript" src="script/demo.js"></script>
15 </head>
16 <body>
17 <div id="top-nav">
18 <img src="image/logo.png" width="196" height="69" alt="jScrollPane">
19 <ul>
20 <li><a href="index.html">Home</a></li>
21 <li><a href="index.html#examples">Examples</a></li>
22 <li><a href="index.html#themes">Themes</a></li>
23 <li><a href="index.html#usage">How to use</a></li>
24 <li><a href="faqs.html">FAQs</a></li>
25 <li><a href="known_issues.html">Known issues</a></li>
26 <li><a href="index.html#support">Support</a></li>
27 <li><a href="index.html#download">Download</a></li>
28 </ul>
29 </div>
30 <div id="container">
31 <h1>jScrollPane - settings object documentation</h1>
32 <p>
33 This page details the various options that you can pass into the settings object when you initialise
ed40602 @vitch Added extra documentation and examples to the site...
authored
34 jScrollPane. Note that there is also a number of changes you can make through the <a href="api.html">
9949982 @vitch Linked the events page in...
authored
35 API</a> after the scrollpane is already initialised and a number of <a href="events.html">events</a> you
36 can listen to.
994dc69 @vitch Added demos with arrows to confirm that that is working with dynamic …
authored
37 </p>
ed40602 @vitch Added extra documentation and examples to the site...
authored
38 <h2 id="showArrows">showArrows <span class="setting-type">- boolean (default false)</span></h2>
994dc69 @vitch Added demos with arrows to confirm that that is working with dynamic …
authored
39 <p>
ed40602 @vitch Added extra documentation and examples to the site...
authored
40 Whether arrows should be shown on the generated scroll pane. When set to false only the scrollbar track
41 and drag will be shown, if set to true then arrows buttons will also be shown. <a href="arrows.html">
42 Demo</a>.
994dc69 @vitch Added demos with arrows to confirm that that is working with dynamic …
authored
43 </p>
ed40602 @vitch Added extra documentation and examples to the site...
authored
44 <h2 id="maintainPosition">maintainPosition <span class="setting-type">- boolean (default true)</span></h2>
45 <p>
46 Whether the scrollpane should attempt to maintain it's position whenever it is reinitialised. If true
47 then the viewport of the scrollpane will remain the same when it is reinitialised, if false then the
c044131 @vitch Renamed the settings parameters which control whether the pane will s…
authored
48 viewport will jump back up to the top when the scrollpane is reinitialised. See also
49 <a href="#stickToBottom">stickToBottom</a> and <a href="#stickToRight">stickToRight</a>.
50 </p>
51 <h2 id="stickToBottom">stickToBottom<span class="setting-type">- boolean (default false)</span></h2>
52 <p>
53 If <a href="#maintainPosition">maintainPosition</a> is true and the scrollpane is scrolled to the
54 bottom then the scrollpane then the scrollpane will remain scrolled to the bottom even if new content
55 is added to the pane which makes it taller.
56 </p>
57 <h2 id="stickToRight">stickToRight<span class="setting-type">- boolean (default false)</span></h2>
58 <p>
59 If <a href="#maintainPosition">maintainPosition</a> is true and the scrollpane is scrolled to its
60 right edge then the scrollpane then the scrollpane will remain scrolled to the right edge even if new
61 content is added to the pane which makes it wider.
ed40602 @vitch Added extra documentation and examples to the site...
authored
62 </p>
63 <h2 id="autoReinitialise">autoReinitialise <span class="setting-type">- boolean (default false)</span></h2>
64 <p>
65 Whether jScrollPane should automatically reinitialise itself periodically after you have initially
66 initialised it. This can help with instances when the size of the content of the scrollpane (or the
67 surrounding element) changes. However, it does involve an overhead of running a javascript function on
68 a timer so it is recommended only to activate where necessary. <a href="auto_reinitialise.html">Demo</a>.
69 </p>
70 <h2 id="autoReinitialiseDelay">autoReinitialiseDelay <span class="setting-type">- int (default 500)</span></h2>
71 <p>
72 The number of milliseconds between each reinitialisation (if <a href="#autoReinitialise">autoReinitialise</a>
73 is true).
74 </p>
75 <h2 id="verticalDragMinHeight">verticalDragMinHeight <span class="setting-type">- int (default 0)</span></h2>
76 <p>
77 The smallest height that the vertical drag can have. The size of the drag elements is based on the
78 proportion of the size of the content to the size of the viewport but is contrained within the minimum
79 and maximum dimensions given. <a href="drag_size.html">Demo</a>.
80 </p>
81 <h2 id="verticalDragMaxHeight">verticalDragMaxHeight <span class="setting-type">- int (default 99999)</span></h2>
82 <p>
83 See <a href="#verticalDragMinHeight">verticalDragMinHeight</a>.
84 </p>
85 <h2 id="horizontalDragMinWidth">horizontalDragMinWidth <span class="setting-type">- int (default 0)</span></h2>
86 <p>
87 See <a href="#verticalDragMinHeight">verticalDragMinHeight</a>.
88 </p>
89 <h2 id="horizontalDragMaxWidth">horizontalDragMaxWidth <span class="setting-type">- int (default 99999)</span></h2>
90 <p>
91 See <a href="#verticalDragMinHeight">verticalDragMinHeight</a>.
92 </p>
8c1f5a1 @vitch Added the new dimension settings to the settings object along with do…
authored
93 <h2 id="contentWidth">contentWidth <span class="setting-type">- int (default undefined)</span></h2>
94 <p>
95 The width of the content of the scroll pane. The default value of undefined will allow jScrollPane to
96 calculate the width of it's content. However, in some cases you will want to disable this (e.g. to
97 prevent horizontal scrolling or where the calculation of the size of the content doesn't return reliable
98 results)
99 </p>
ed40602 @vitch Added extra documentation and examples to the site...
authored
100 <h2 id="animateScroll">animateScroll <span class="setting-type">- boolean (default false)</span></h2>
101 <p>
102 Whether to use animation when calling <a href="api.html#scrollTo">scrollTo</a> or <a href="api.html#scrollBy">
103 scrollBy</a>. You can control the animation speed and easing by using the <a href="#animateDuration">
104 animateDuration</a> and <a href="#animateEase">animateEase</a> settings or if you want to exercise more
105 complete control then you can override the <a href="api.html#animate">animate</a> API method.
106 <a href="scroll_to_animate.html">Demo</a>.
107 </p>
108 <h2 id="animateDuration">animateDuration <span class="setting-type">- int (default 300)</span></h2>
109 <p>
110 The number of milliseconds taken to animate to a new position (see <a href="#animateScroll">animateScroll
111 </a>).
112 </p>
113 <h2 id="animateEase">animateEase <span class="setting-type">- string (default 'linear')</span></h2>
114 <p>
115 The type of easing to use when animating to a new position (see <a href="#animateScroll">animateScroll
116 </a> and <a href="http://api.jquery.com/animate/#easing">easing</a>).
117 </p>
118 <h2 id="hijackInternalLinks">hijackInternalLinks <span class="setting-type">- boolean (default false)</span></h2>
119 <p>
120 Whether internal links on the page should be hijacked so that if they point so content within a
121 jScrollPane then they automatically scroll the jScrollPane to the correct place. <a href="anchors.html">
122 Demo</a>.
123 </p>
124 <h2 id="verticalGutter">verticalGutter <span class="setting-type">- int (default 4)</span></h2>
125 <p>
126 The amount of space between the side of the content and the vertical scrollbar.
127 </p>
128 <h2 id="horizontalGutter">horizontalGutter <span class="setting-type">- int (default 4)</span></h2>
129 <p>
130 The amount of space between the bottom of the content and the horizontal scrollbar.
131 </p>
132 <h2 id="mouseWheelSpeed">mouseWheelSpeed <span class="setting-type">- int (default 10)</span></h2>
133 <p>
134 A multiplier which is used to control the amount that the scrollpane scrolls each time the mouse wheel
af106e1 @vitch Updated release notes and documentation to match changes in mousewhee…
authored
135 is turned. If a recent version of the mousewheel plugin is used then the `deltaFactor` from that is used
136 to get a [more reliable](https://github.com/brandonaaron/jquery-mousewheel#getting-the-scroll-distance)
137 indication of how far the user wanted to scroll.
ed40602 @vitch Added extra documentation and examples to the site...
authored
138 </p>
139 <h2 id="arrowButtonSpeed">arrowButtonSpeed <span class="setting-type">- int (default 10)</span></h2>
140 <p>
141 A multiplier which is used to control the amount that the scrollpane scrolls each time on of the arrow
142 buttons is pressed.
143 </p>
144 <h2 id="arrowRepeatFreq">arrowRepeatFreq <span class="setting-type">- int (default 100)</span></h2>
145 <p>
146 The number of milliseconds between each repeated scroll event when the mouse is held down over one of
147 the arrow keys.
148 </p>
149 <h2 id="arrowScrollOnHover">arrowScrollOnHover <span class="setting-type">- boolean (default false)</span></h2>
150 <p>
151 Whether the arrow buttons should cause the jScrollPane to scroll while you are hovering over them.
152 <a href="arrow_hover.html">Demo</a>.
153 </p>
154 <h2 id="verticalArrowPositions">
155 verticalArrowPositions <span class="setting-type">- string [split|before|after|os] (default split)</span>
156 </h2>
157 <p>
158 Where the vertical arrows should appear relative to the vertical track. <a href="arrow_positions.html">
159 Demo</a>.
160 </p>
161 <h2 id="horizontalArrowPositions">
162 horizontalArrowPositions <span class="setting-type">- string [split|before|after|os] (default split)</span>
163 </h2>
164 <p>
165 Where the horizontal arrows should appear relative to the horizontal track. <a href="arrow_positions.html">
166 Demo</a>.
167 </p>
e0b7dd6 @vitch Fixed the ID on the settings page for enableKeyboardNavigation
authored
168 <h2 id="enableKeyboardNavigation">
27200a6 @vitch Added an "enableKeyboardNavigation" setting...
authored
169 enableKeyboardNavigation <span class="setting-type">- boolean (default true)</span>
170 </h2>
171 <p>
172 Whether keyboard navigation should be enabled (e.g. whether the user can focus the scrollpane and then
173 use the arrow (and other) keys to navigate around.
174 </p>
175 <h2 id="hideFocus">
dd4c5bb @aFarkas added keyboard /cursor support (issue #3)
aFarkas authored
176 hideFocus <span class="setting-type">- boolean (default false)</span>
177 </h2>
178 <p>
27200a6 @vitch Added an "enableKeyboardNavigation" setting...
authored
179 Whether the focus outline should be hidden in all browsers. For best accessibility you should not change
180 this option. You can style the outline with the CSS property outline and outline-offset.
dd4c5bb @aFarkas added keyboard /cursor support (issue #3)
aFarkas authored
181 </p>
1ddf353 @vitch Work on enabling clicking on the track to scroll the scrollpane (see …
authored
182 <h2 id="clickOnTrack">
183 clickOnTrack <span class="setting-type">- boolean (default true)</span>
184 </h2>
185 <p>
186 Whether clicking on the track (e.g. the area behind the drag) should scroll towards the point clicked on.
187 Defaults to true as this is the native behaviour in these situations.
188 </p>
189 <h2 id="trackClickSpeed">trackClickSpeed <span class="setting-type">- int (default 30)</span></h2>
190 <p>
191 A multiplier which is used to control the amount that the scrollpane scrolls each trackClickRepeatFreq
192 while the mouse button is held down over the track.
193 </p>
194 <h2 id="trackClickRepeatFreq">trackClickRepeatFreq <span class="setting-type">- int (default 100)</span></h2>
195 <p>
196 The number of milliseconds between each repeated scroll event when the mouse is held down over the
197 track.
198 </p>
ed40602 @vitch Added extra documentation and examples to the site...
authored
199
994dc69 @vitch Added demos with arrows to confirm that that is working with dynamic …
authored
200 </div>
201 </body>
202 </html>
Something went wrong with that request. Please try again.