prettydocs_rails 1.1.16

Sign up to get free protection for your applications and to get access to all the features.
Files changed (117) hide show
  1. checksums.yaml +7 -0
  2. data/LICENSE +57 -0
  3. data/README.md +91 -0
  4. data/Rakefile +34 -0
  5. data/app/assets/javascripts/prettydocs.js +6 -0
  6. data/app/assets/stylesheets/prettydocs.scss +6 -0
  7. data/lib/prettydocs_rails.rb +24 -0
  8. data/lib/prettydocs_rails/engine.rb +10 -0
  9. data/lib/prettydocs_rails/version.rb +3 -0
  10. data/vendor/assets/images/demo/appkit-account-billing-thumb.jpg +0 -0
  11. data/vendor/assets/images/demo/appkit-account-billing.jpg +0 -0
  12. data/vendor/assets/images/demo/appkit-account-drive-thumb.jpg +0 -0
  13. data/vendor/assets/images/demo/appkit-account-drive.jpg +0 -0
  14. data/vendor/assets/images/demo/appkit-account-messages-thumb.jpg +0 -0
  15. data/vendor/assets/images/demo/appkit-account-messages.jpg +0 -0
  16. data/vendor/assets/images/demo/appkit-account-profile-thumb.jpg +0 -0
  17. data/vendor/assets/images/demo/appkit-account-profile.jpg +0 -0
  18. data/vendor/assets/images/demo/appkit-account-reminders-thumb.jpg +0 -0
  19. data/vendor/assets/images/demo/appkit-account-reminders.jpg +0 -0
  20. data/vendor/assets/images/demo/appkit-account-settings-thumb.jpg +0 -0
  21. data/vendor/assets/images/demo/appkit-account-settings.jpg +0 -0
  22. data/vendor/assets/images/demo/appkit-activities-thumb.jpg +0 -0
  23. data/vendor/assets/images/demo/appkit-activities.jpg +0 -0
  24. data/vendor/assets/images/demo/appkit-chart-chartjs-thumb.jpg +0 -0
  25. data/vendor/assets/images/demo/appkit-chart-chartjs.jpg +0 -0
  26. data/vendor/assets/images/demo/appkit-chart-flot-thumb.jpg +0 -0
  27. data/vendor/assets/images/demo/appkit-chart-flot.jpg +0 -0
  28. data/vendor/assets/images/demo/appkit-chart-inline-thumb.jpg +0 -0
  29. data/vendor/assets/images/demo/appkit-chart-inline.jpg +0 -0
  30. data/vendor/assets/images/demo/appkit-chart-morris-thumb.jpg +0 -0
  31. data/vendor/assets/images/demo/appkit-chart-morris.jpg +0 -0
  32. data/vendor/assets/images/demo/appkit-dashboard-1-thumb.jpg +0 -0
  33. data/vendor/assets/images/demo/appkit-dashboard-1.jpg +0 -0
  34. data/vendor/assets/images/demo/appkit-dashboard-2-thumb.jpg +0 -0
  35. data/vendor/assets/images/demo/appkit-dashboard-2.jpg +0 -0
  36. data/vendor/assets/images/demo/appkit-dashboard-3-thumb.jpg +0 -0
  37. data/vendor/assets/images/demo/appkit-dashboard-3.jpg +0 -0
  38. data/vendor/assets/images/demo/appkit-dashboard-4-thumb.jpg +0 -0
  39. data/vendor/assets/images/demo/appkit-dashboard-4.jpg +0 -0
  40. data/vendor/assets/images/demo/appkit-discussion-thumb.jpg +0 -0
  41. data/vendor/assets/images/demo/appkit-discussion.jpg +0 -0
  42. data/vendor/assets/images/demo/appkit-discussions-thumb.jpg +0 -0
  43. data/vendor/assets/images/demo/appkit-discussions.jpg +0 -0
  44. data/vendor/assets/images/demo/appkit-inbox-thumb.jpg +0 -0
  45. data/vendor/assets/images/demo/appkit-inbox.jpg +0 -0
  46. data/vendor/assets/images/demo/appkit-member-thumb.jpg +0 -0
  47. data/vendor/assets/images/demo/appkit-member.jpg +0 -0
  48. data/vendor/assets/images/demo/appkit-members-thumb.jpg +0 -0
  49. data/vendor/assets/images/demo/appkit-members.jpg +0 -0
  50. data/vendor/assets/images/demo/appkit-pricing-thumb.jpg +0 -0
  51. data/vendor/assets/images/demo/appkit-pricing.jpg +0 -0
  52. data/vendor/assets/images/demo/appkit-project-thumb.jpg +0 -0
  53. data/vendor/assets/images/demo/appkit-project.jpg +0 -0
  54. data/vendor/assets/images/demo/appkit-projects-thumb.jpg +0 -0
  55. data/vendor/assets/images/demo/appkit-projects.jpg +0 -0
  56. data/vendor/assets/images/demo/appkit-tickets-thumb.jpg +0 -0
  57. data/vendor/assets/images/demo/appkit-tickets.jpg +0 -0
  58. data/vendor/assets/images/demo/appkit-timeline-thumb.jpg +0 -0
  59. data/vendor/assets/images/demo/appkit-timeline.jpg +0 -0
  60. data/vendor/assets/images/demo/appkit-widgets-thumb.jpg +0 -0
  61. data/vendor/assets/images/demo/appkit-widgets.jpg +0 -0
  62. data/vendor/assets/images/demo/author-profile.png +0 -0
  63. data/vendor/assets/images/demo/elegant-icon-font.jpg +0 -0
  64. data/vendor/assets/images/demo/fontawesome-icons.png +0 -0
  65. data/vendor/assets/images/demo/theme-atom.png +0 -0
  66. data/vendor/assets/images/demo/theme-college-green.png +0 -0
  67. data/vendor/assets/images/demo/theme-decibel.png +0 -0
  68. data/vendor/assets/images/demo/theme-delta.png +0 -0
  69. data/vendor/assets/images/demo/theme-devaid.png +0 -0
  70. data/vendor/assets/images/demo/theme-developer.png +0 -0
  71. data/vendor/assets/images/demo/theme-devstudio.png +0 -0
  72. data/vendor/assets/images/demo/theme-epicure.png +0 -0
  73. data/vendor/assets/images/demo/theme-matrimony.png +0 -0
  74. data/vendor/assets/images/demo/theme-onboard.png +0 -0
  75. data/vendor/assets/images/demo/theme-tempo.png +0 -0
  76. data/vendor/assets/images/demo/theme-trades.png +0 -0
  77. data/vendor/assets/images/demo/theme-velocity.png +0 -0
  78. data/vendor/assets/images/empty.gif +0 -0
  79. data/vendor/assets/javascripts/ekko-lightbox.js +602 -0
  80. data/vendor/assets/javascripts/jquery-match-height/CHANGELOG.md +24 -0
  81. data/vendor/assets/javascripts/jquery-match-height/LICENSE +21 -0
  82. data/vendor/assets/javascripts/jquery-match-height/README.md +170 -0
  83. data/vendor/assets/javascripts/jquery-match-height/bower.json +26 -0
  84. data/vendor/assets/javascripts/jquery-match-height/jquery.matchHeight-min.js +10 -0
  85. data/vendor/assets/javascripts/jquery-match-height/jquery.matchHeight.js +298 -0
  86. data/vendor/assets/javascripts/jquery-match-height/matchHeight.jquery.json +32 -0
  87. data/vendor/assets/javascripts/jquery-match-height/test.css +265 -0
  88. data/vendor/assets/javascripts/jquery-match-height/test.html +288 -0
  89. data/vendor/assets/javascripts/jquery-match-height/test.js +33 -0
  90. data/vendor/assets/javascripts/jquery-scrollTo/CHANGELOG +178 -0
  91. data/vendor/assets/javascripts/jquery-scrollTo/LICENSE +22 -0
  92. data/vendor/assets/javascripts/jquery-scrollTo/README.md +151 -0
  93. data/vendor/assets/javascripts/jquery-scrollTo/bower.json +28 -0
  94. data/vendor/assets/javascripts/jquery-scrollTo/composer.json +32 -0
  95. data/vendor/assets/javascripts/jquery-scrollTo/demo/css/style.css +150 -0
  96. data/vendor/assets/javascripts/jquery-scrollTo/demo/css/style.old.css +69 -0
  97. data/vendor/assets/javascripts/jquery-scrollTo/demo/index.html +252 -0
  98. data/vendor/assets/javascripts/jquery-scrollTo/demo/index.old.html +128 -0
  99. data/vendor/assets/javascripts/jquery-scrollTo/jquery.scrollTo.js +210 -0
  100. data/vendor/assets/javascripts/jquery-scrollTo/jquery.scrollTo.min.js +7 -0
  101. data/vendor/assets/javascripts/jquery-scrollTo/package.json +20 -0
  102. data/vendor/assets/javascripts/jquery-scrollTo/tests/ElemMaxY-compat.html +21 -0
  103. data/vendor/assets/javascripts/jquery-scrollTo/tests/ElemMaxY-quirks.html +20 -0
  104. data/vendor/assets/javascripts/jquery-scrollTo/tests/WinMaxY-compat.html +19 -0
  105. data/vendor/assets/javascripts/jquery-scrollTo/tests/WinMaxY-quirks.html +18 -0
  106. data/vendor/assets/javascripts/jquery-scrollTo/tests/WinMaxY-to-iframe-compat.html +20 -0
  107. data/vendor/assets/javascripts/jquery-scrollTo/tests/WinMaxY-to-iframe-quirks.html +19 -0
  108. data/vendor/assets/javascripts/jquery-scrollTo/tests/WinMaxY-with-iframe-compat.html +11 -0
  109. data/vendor/assets/javascripts/jquery-scrollTo/tests/WinMaxY-with-iframe-quirks.html +10 -0
  110. data/vendor/assets/javascripts/jquery-scrollTo/tests/index.html +24 -0
  111. data/vendor/assets/javascripts/jquery-scrollTo/tests/test.js +21 -0
  112. data/vendor/assets/javascripts/main.js +47 -0
  113. data/vendor/assets/javascripts/prism.js +18 -0
  114. data/vendor/assets/stylesheets/ekko-lightbox.scss +2 -0
  115. data/vendor/assets/stylesheets/prism.scss +163 -0
  116. data/vendor/assets/stylesheets/styles.scss +1267 -0
  117. metadata +267 -0
@@ -0,0 +1,150 @@
1
+ body{
2
+ padding:5px;
3
+ height:1600px;
4
+ font-family: Verdana, sans-serif;
5
+ background-color: #DDD;
6
+ }
7
+ ul,li,h1,h2,h3,h4,p{
8
+ list-style:none;
9
+ padding:0;
10
+ margin:0;
11
+ }
12
+ .part{
13
+ border:1px solid black;
14
+ background-color:white;
15
+ }
16
+ .part h3,
17
+ .part h4,
18
+ .part h4 a {
19
+ color:#933;
20
+ }
21
+ #toc{
22
+ display:block;
23
+ padding:10px;
24
+ position:relative;
25
+ margin:15px 0;
26
+ float:left;
27
+ width:305px;
28
+ }
29
+ #toc h3{
30
+ padding-bottom:10px;
31
+ }
32
+ #toc h3 strong{
33
+ font-size:13px;
34
+ color:black;
35
+ }
36
+ #links{
37
+ border:1px solid black;
38
+ width:210px;
39
+ padding:10px;
40
+ float:right;
41
+ margin-top:-30px;
42
+ }
43
+ #links h3{
44
+ color:#933;
45
+ }
46
+ #links ul{
47
+ padding: 8px 0 3px 20px;
48
+ }
49
+ #links li{
50
+ list-style-type:circle;
51
+ }
52
+ #links a{
53
+ color:#69C;
54
+ }
55
+
56
+ #toc li, #links li{
57
+ list-style-type:circle;
58
+ padding-left:5px;
59
+ margin-left:15px;
60
+ }
61
+ #toc a{
62
+ color:#69C;
63
+ }
64
+ .section{
65
+ border:1px black solid;
66
+ width:950px;
67
+ padding:10px;
68
+ margin: 5px 0;
69
+ position:relative;
70
+ clear:both;
71
+ }
72
+ .section h3{
73
+ margin-bottom:10px;
74
+ margin-left: 8px;
75
+ }
76
+ .section h4{
77
+ margin:10px 0 10px 8px;
78
+ }
79
+ .section li{
80
+ float:left;
81
+ }
82
+ .pane{
83
+ overflow:auto;
84
+ clear:left;
85
+ margin: 10px 0 0 10px;
86
+ position:relative;
87
+ width:826px;
88
+ height:322px;
89
+ }
90
+ ul.elements{
91
+ background-color:#5B739C;
92
+ }
93
+ ul.elements li{
94
+ width:200px;
95
+ height:100px;
96
+ font-weight:bolder;
97
+ border:1px black solid;
98
+ text-align:center;
99
+ padding:50px;
100
+ position:relative;
101
+ background-color:#DDD;
102
+ }
103
+ ul.elements li a{
104
+ bottom:20px;
105
+ color:#933;
106
+ font-size:12px;
107
+ left:125px;
108
+ position:absolute;
109
+ }
110
+ ul.elements li p{
111
+ color:#666;
112
+ }
113
+ #pane-settings ul.elements li{
114
+ margin:5px;
115
+ }
116
+ #pane-settings{
117
+ margin-bottom:10px;
118
+ }
119
+ ul.links{
120
+ height:20px;
121
+ overflow:hidden;
122
+ padding-left: 5px;
123
+ }
124
+ ul.links a{
125
+ color:#69C;
126
+ margin:0 0 0 5px;
127
+ }
128
+ .clear{
129
+ clear:left;
130
+ }
131
+ h3 span{
132
+ position:absolute;
133
+ }
134
+ .message{
135
+ background:#EEE;
136
+ border:1px solid #999;
137
+ color:#333;
138
+ font-size:12px;
139
+ font-weight:normal;
140
+ padding:1px;
141
+ margin-top:2px;
142
+ }
143
+
144
+ h1{
145
+ color:#5B739C;
146
+ }
147
+ h1 strong{
148
+ font-size:13px;
149
+ color:#777;
150
+ }
@@ -0,0 +1,69 @@
1
+ body{
2
+ background-color: #DDD;
3
+ }
4
+ .container li,div.pane{
5
+ height:200px;
6
+ font-weight:bolder;
7
+ position:relative;
8
+ }
9
+ ul{
10
+ list-style:none;
11
+ padding:0;
12
+ margin:0;
13
+ }
14
+ .container a{
15
+ color:black;
16
+ position:absolute;
17
+ bottom:10px;
18
+ }
19
+ p{
20
+ margin:0;
21
+ }
22
+ .container{
23
+ border:1px black solid;
24
+ margin:30px;
25
+ overflow:auto;
26
+ position:relative;
27
+ width:80%;
28
+ height:300px;
29
+ }
30
+ .container ul{
31
+ padding:0;
32
+ }
33
+ #x{
34
+ height:217px;
35
+ }
36
+ #x li,#xy li{
37
+ width:300px;
38
+ float:left;
39
+ }
40
+
41
+ h1{
42
+ color:#5B739C;
43
+ }
44
+ h1 strong{
45
+ font-size:13px;
46
+ color:#777;
47
+ }
48
+
49
+ #links{
50
+ border:1px solid black;
51
+ width:210px;
52
+ padding:10px;
53
+ float:right;
54
+ margin-top:-55px;
55
+ background-color:white;
56
+ }
57
+ #links h3{
58
+ color:#933;
59
+ margin:5px;
60
+ }
61
+ #links ul{
62
+ padding: 8px 0 3px 20px;
63
+ }
64
+ #links li{
65
+ list-style-type:circle;
66
+ }
67
+ #links a{
68
+ color:#69C;
69
+ }
@@ -0,0 +1,252 @@
1
+ <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
2
+ <html xmlns="http://www.w3.org/1999/xhtml">
3
+ <head>
4
+ <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
5
+ <title>jQuery.scrollTo</title>
6
+ <meta name="keywords" content="javascript, jquery, plugins, scroll, scrollTo, smooth, animation, to, effect, ariel, flesler, window, overflow, element, navigation, customizable" />
7
+ <meta name="description" content="Demo of jQuery.scrollTo. Lightweight, cross-browser and highly customizable animated scrolling with jQuery, made by Ariel Flesler." />
8
+ <meta name="robots" content="index,follow" />
9
+ <link type="text/css" rel="stylesheet" href="css/style.css" />
10
+ <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js"></script>
11
+ <script type="text/javascript" src="../jquery.scrollTo.min.js"></script>
12
+ <script type="text/javascript">
13
+ jQuery(function( $ ){
14
+ /**
15
+ * Demo binding and preparation, no need to read this part
16
+ */
17
+ //borrowed from jQuery easing plugin
18
+ //http://gsgd.co.uk/sandbox/jquery.easing.php
19
+ $.easing.elasout = function(x, t, b, c, d) {
20
+ var s=1.70158;var p=0;var a=c;
21
+ if (t==0) return b; if ((t/=d)==1) return b+c; if (!p) p=d*.3;
22
+ if (a < Math.abs(c)) { a=c; var s=p/4; }
23
+ else var s = p/(2*Math.PI) * Math.asin (c/a);
24
+ return a*Math.pow(2,-10*t) * Math.sin( (t*d-s)*(2*Math.PI)/p ) + c + b;
25
+ };
26
+ $('a.back').click(function() {
27
+ $(this).parents('div.pane').scrollTo(0, 800, { queue:true });
28
+ $(this).parents('div.section').find('span.message').text( this.title);
29
+ return false;
30
+ });
31
+ //just for the example, to stop the click on the links.
32
+ $('ul.links').click(function(e){
33
+ var link = e.target;
34
+ if (link.target === '_blank') {
35
+ return;
36
+ }
37
+ e.preventDefault();
38
+ link.blur();
39
+ if (link.title) {
40
+ $(this).parent().find('span.message').text(link.title);
41
+ }
42
+ });
43
+
44
+ // This one is important, many browsers don't reset scroll on refreshes
45
+ // Reset all scrollable panes to (0,0)
46
+ $('div.pane').scrollTo(0);
47
+ // Reset the screen to (0,0)
48
+ $.scrollTo(0);
49
+
50
+ // TOC, shows how to scroll the whole window
51
+ $('#toc a').click(function() {//$.scrollTo works EXACTLY the same way, but scrolls the whole screen
52
+ $.scrollTo(this.hash, 1500, { easing:'elasout' });
53
+ $(this.hash).find('span.message').text(this.title);
54
+ return false;
55
+ });
56
+
57
+ // Target examples bindings
58
+ var $target = $('#pane-target');
59
+ $('#target-examples a').click(function() {
60
+ $target.stop(true);
61
+ });
62
+
63
+ $('#relative-selector').click(function() {
64
+ $target.scrollTo('li:eq(7)', 800);
65
+ });
66
+ $('#jquery-object').click(function() {
67
+ $target.scrollTo($('#pane-target li:eq(14)') , 800);
68
+ });
69
+ $('#dom-element').click(function() {
70
+ $target.scrollTo(document.getElementById('twenty'), 800);
71
+ });
72
+ $('#absolute-number').click(function() {
73
+ $target.scrollTo(150, 800);
74
+ });
75
+ $('#absolute-number-hash').click(function() {
76
+ $target.scrollTo({ top:800, left:700}, 800);
77
+ });
78
+ $('#absolute-px').click(function() {
79
+ $target.scrollTo('520px', 800);
80
+ });
81
+ $('#absolute-px-hash').click(function() {
82
+ $target.scrollTo({top:'110px', left:'290px'}, 800);
83
+ });
84
+ $('#relative-px').click(function() {
85
+ $target.scrollTo('+=100', 500);
86
+ });
87
+ $('#relative-px-hash').click(function() {
88
+ $target.scrollTo({top:'-=100px', left:'+=100'}, 500);
89
+ });
90
+ $('#percentage-px').click(function() {
91
+ $target.scrollTo('50%', 800);
92
+ });
93
+ $('#percentage-px-hash').click(function() {
94
+ $target.scrollTo({top:'50%', left:'20%'}, 800);
95
+ });
96
+
97
+ // Settings examples bindings, they will all scroll to the same place, with different settings
98
+ var $settings = $('#pane-settings');
99
+ $('#settings-examples a').click(function() {
100
+ // before each animation, reset to (0,0), skip this.
101
+ $settings.stop(true).scrollTo(0);
102
+ });
103
+
104
+ $('#settings-no').click(function() {
105
+ $settings.scrollTo('li:eq(15)', 1000);
106
+ });
107
+ $('#settings-axis').click(function() {// only scroll horizontally
108
+ $settings.scrollTo('li:eq(15)', 1000, { axis:'x' });
109
+ });
110
+ $('#settings-duration').click(function() {// it's the same as specifying it in the 2nd argument
111
+ $settings.scrollTo('li:eq(15)', { duration: 3000 });
112
+ });
113
+ $('#settings-easing').click(function() {
114
+ $settings.scrollTo('li:eq(15)', 2500, { easing:'elasout' });
115
+ });
116
+ $('#settings-margin').click(function() {//scroll to the "outer" position of the element
117
+ $settings.scrollTo('li:eq(15)', 1000, { margin:true });
118
+ });
119
+ $('#settings-offset').click(function() {//same as { top:-50, left:-50 }
120
+ $settings.scrollTo('li:eq(15)', 1000, { offset:-50 });
121
+ });
122
+ $('#settings-offset-hash').click(function() {
123
+ $settings.scrollTo('li:eq(15)', 1000, { offset:{ top:-5, left:-30 } });
124
+ });
125
+ $('#settings-offset-function').click(function() {
126
+ $settings.scrollTo('li:eq(15)', 1000, {offset: function() { return {top:-30, left:-5}; }});
127
+ });
128
+ $('#settings-over').click(function() {//same as { top:-50, left:-50 }
129
+ $settings.scrollTo('li:eq(15)', 1000, { over:0.5 });
130
+ });
131
+ $('#settings-over-hash').click(function() {
132
+ $settings.scrollTo('li:eq(15)', 1000, { over:{ top:0.2, left:-0.5 } });
133
+ });
134
+ $('#settings-interrupt').click(function() {
135
+ $settings.scrollTo('li:eq(15)', 10000, { interrupt:true });
136
+ });
137
+ $('#settings-queue').click(function() {//in this case, having 'axis' as 'xy' or 'yx' matters.
138
+ $settings.scrollTo('li:eq(15)', 2000, { queue:true });
139
+ });
140
+ $('#settings-onAfter').click(function() {
141
+ $settings.scrollTo('li:eq(15)', 2000, {
142
+ onAfter:function() {
143
+ $('#settings-message').text('Got there!');
144
+ }
145
+ });
146
+ });
147
+ $('#settings-onAfterFirst').click(function() {//onAfterFirst exists only when queuing
148
+ $settings.scrollTo('li:eq(15)', 1600, {
149
+ queue:true,
150
+ onAfterFirst:function() {
151
+ $('#settings-message').text('Got there horizontally!');
152
+ },
153
+ onAfter:function() {
154
+ $('#settings-message').text('Got there vertically!');
155
+ }
156
+ });
157
+ });
158
+ $('#settings-step').click(function() {
159
+ $settings.scrollTo('li:eq(15)', 2000, {step:function(now) {
160
+ $('#settings-message').text(now.toFixed(2));
161
+ }});
162
+ });
163
+ $('#settings-progress').click(function() {
164
+ $settings.scrollTo('li:eq(15)', 2000, {progress:function(_, now) {
165
+ $('#settings-message').text(Math.round(now*100) + '%');
166
+ }});
167
+ });
168
+ $('#settings-fail').click(function() {
169
+ $settings.scrollTo('li:eq(15)', 10000, {interrupt:true, fail:function() {
170
+ $('#settings-message').text('Scroll interrupted!');
171
+ }});
172
+ });
173
+ });
174
+ </script>
175
+ </head>
176
+ <body>
177
+ <h1>jQuery.scrollTo&nbsp;<strong>by Ariel Flesler</strong></h1>
178
+
179
+ <div id="toc" class="part">
180
+ <h3>Table of contents&nbsp;<strong>(try these)</strong></h3>
181
+ <ul>
182
+ <li><a title="$.scrollTo('#target-examples', 800, {easing:'elasout'});" href="#target-examples">Ways to specify the target</a></li>
183
+ <li><a title="$.scrollTo('#settings-examples', 800, {easing:'elasout'});" href="#settings-examples">Settings</a></li>
184
+ </ul>
185
+ </div>
186
+
187
+ <div id="links" class="part">
188
+ <h3>Links</h3>
189
+ <ul>
190
+ <li><a target="_blank" href="https://github.com/flesler/jquery.scrollTo">Github</a></li>
191
+ <li><a target="_blank" href="http://flesler.blogspot.com/2007/10/jqueryscrollto.html">Main blog article</a></li>
192
+ <li><a target="_blank" href="http://demos.flesler.com/jquery/localScroll/">LocalScroll Demo</a></li>
193
+ <li><a target="_blank" href="http://demos.flesler.com/jquery/serialScroll/">SerialScroll Demo</a></li>
194
+ <li><a target="_blank" href="index.old.html">Old Demo</a></li>
195
+ </ul>
196
+ </div>
197
+ <div id="target-examples" class="section part">
198
+ <h3>Ways to specify the target&nbsp;<span id="target-message" class="message">Click an option, to see it in action</span></h3>
199
+ <ul class="links">
200
+ <li><a title="$(...).scrollTo('li:eq(7)', 800);" id="relative-selector" href="#">Relative selector</a></li>
201
+ <li><a title="$(...).scrollTo($('div li:eq(14)'), 800);" id="jquery-object" href="#">jQuery object</a></li>
202
+ <li><a title="$(...).scrollTo(document.getElementById('twenty'), 800);" id="dom-element" href="#">DOM Element</a></li>
203
+ <li><a title="$(...).scrollTo(150, 800);" id="absolute-number" href="#">Absolute number</a></li>
204
+ <li><a title="$(...).scrollTo({ top:800, left:700}, 800);" id="absolute-number-hash" href="#">Absolute number(hash)</a></li>
205
+ </ul>
206
+ <ul class="links">
207
+ <li><a title="$(...).scrollTo('520px', 800);" id="absolute-px" href="#">Absolute px</a></li>
208
+ <li><a title="$(...).scrollTo({top:'110px', left:'290px'}, 800);" id="absolute-px-hash" href="#">Absolute px(hash)</a></li>
209
+ <li><a title="$(...).scrollTo('+=100px', 800);" id="relative-px" href="#">Relative px</a></li>
210
+ <li><a title="$(...).scrollTo({top:'-=100px', left:'+=100'}, 800);" id="relative-px-hash" href="#">Relative px(hash)</a></li>
211
+ <li><a title="$(...).scrollTo('50%', 800);" id="percentage-px" href="#">Percent</a></li>
212
+ <li><a title="$(...).scrollTo({top:'50%', left:'20%'}, 800);" id="percentage-px-hash" href="#">Percent(hash)</a></li>
213
+ </ul>
214
+ <div id="pane-target" class="pane">
215
+ <ul class="elements" style="height:1011px; width:1820px;">
216
+ <li><p>0</p><a href="#" title="$(...).scrollTo(0, 800, {queue:true});" class="back">go back</a></li><li><p>1</p><a href="#" title="$(...).scrollTo(0, 800, {queue:true});" class="back">go back</a></li><li><p>2</p><a href="#" title="$(...).scrollTo(0, 800, {queue:true});" class="back">go back</a></li><li><p>3</p><a href="#" title="$(...).scrollTo(0, 800, {queue:true});" class="back">go back</a></li><li><p>4</p><a href="#" title="$(...).scrollTo(0, 800, {queue:true});" class="back">go back</a></li><li><p>5</p><a href="#" title="$(...).scrollTo(0, 800, {queue:true});" class="back">go back</a></li><li><p>6</p><a href="#" title="$(...).scrollTo(0, 800, {queue:true});" class="back">go back</a></li><li><p>7</p><a href="#" title="$(...).scrollTo(0, 800, {queue:true});" class="back">go back</a></li><li><p>8</p><a href="#" title="$(...).scrollTo(0, 800, {queue:true});" class="back">go back</a></li><li><p>9</p><a href="#" title="$(...).scrollTo(0, 800, {queue:true});" class="back">go back</a></li><li><p>10</p><a href="#" title="$(...).scrollTo(0, 800, {queue:true});" class="back">go back</a></li><li><p>11</p><a href="#" title="$(...).scrollTo(0, 800, {queue:true});" class="back">go back</a></li><li><p>12</p><a href="#" title="$(...).scrollTo(0, 800, {queue:true});" class="back">go back</a></li><li><p>13</p><a href="#" title="$(...).scrollTo(0, 800, {queue:true});" class="back">go back</a></li><li><p>14</p><a href="#" title="$(...).scrollTo(0, 800, {queue:true});" class="back">go back</a></li><li><p>15</p><a href="#" title="$(...).scrollTo(0, 800, {queue:true});" class="back">go back</a></li><li><p>16</p><a href="#" title="$(...).scrollTo(0, 800, {queue:true});" class="back">go back</a></li><li><p>17</p><a href="#" title="$(...).scrollTo(0, 800, {queue:true});" class="back">go back</a></li><li><p>18</p><a href="#" title="$(...).scrollTo(0, 800, {queue:true});" class="back">go back</a></li><li><p>19</p><a href="#" title="$(...).scrollTo(0, 800, {queue:true});" class="back">go back</a></li><li id="twenty"><p>20</p><a href="#" title="$(...).scrollTo(0, 800, {queue:true});" class="back">go back</a></li><li><p>21</p><a href="#" title="$(...).scrollTo(0, 800, {queue:true});" class="back">go back</a></li><li><p>22</p><a href="#" title="$(...).scrollTo(0, 800, {queue:true});" class="back">go back</a></li><li><p>23</p><a href="#" title="$(...).scrollTo(0, 800, {queue:true});" class="back">go back</a></li><li><p>24</p><a href="#" title="$(...).scrollTo(0, 800, {queue:true});" class="back">go back</a></li><li><p>25</p><a href="#" title="$(...).scrollTo(0, 800, {queue:true});" class="back">go back</a></li><li><p>26</p><a href="#" title="$(...).scrollTo(0, 800, {queue:true});" class="back">go back</a></li><li><p>27</p><a href="#" title="$(...).scrollTo(0, 800, {queue:true});" class="back">go back</a></li><li><p>28</p><a href="#" title="$(...).scrollTo(0, 800, {queue:true});" class="back">go back</a></li><li><p>29</p><a href="#" title="$(...).scrollTo(0, 800, {queue:true});" class="back">go back</a></li>
217
+ </ul>
218
+ </div>
219
+ </div>
220
+ <div id="settings-examples" class="section part">
221
+ <h3>Settings&nbsp;<span id="settings-message" class="message">The examples shown here, are summarized for brevity</span></h3>
222
+ <ul class="links">
223
+ <li><a title="$(...).scrollTo('li:eq(15)', 1000);" id="settings-no" href="#">no settings</a></li>
224
+ <li><a title="$(...).scrollTo('li:eq(15)', 1000, {axis:'x'});//only scroll on this axis (can be x, y, xy or yx)" id="settings-axis" href="#">axis</a></li>
225
+ <li><a title="$(...).scrollTo('li:eq(15)', 1000, {margin:true});//deduct the margin and border from the final position" id="settings-margin" href="#">margin</a></li>
226
+ <li><a title="$(...).scrollTo('li:eq(15)', 1000, {offset:-50});//add or deduct from the final position" id="settings-offset" href="#">offset</a></li>
227
+ <li><a title="$(...).scrollTo('li:eq(15)', 1000, {offset: {top:-5, left:-30} });" id="settings-offset-hash" href="#">offset(hash)</a></li>
228
+ <li><a title="$(...).scrollTo('li:eq(15)', 1000, {offset: function() { return {top:-30, left:-5}; }});" id="settings-offset-function" href="#">offset(function)</a></li>
229
+ <li><a title="$(...).scrollTo('li:eq(15)', 1000, {over:0.5});//add or deduct a fraction of its height/width" id="settings-over" href="#">over</a></li>
230
+ <li><a title="$(...).scrollTo('li:eq(15)', 1000, {over:{top:0.2, left:-0.5});" id="settings-over-hash" href="#">over(hash)</a></li>
231
+ <li><a title="Scroll manually to interrupt the animation" id="settings-interrupt" href="#">interrupt</a></li>
232
+ <li><a title="$(...).scrollTo('li:eq(15)', 1600, {onAfter:function() { } });//called after the scrolling ends" id="settings-onAfter" href="#">onAfter</a></li>
233
+ <li><a title="$(...).scrollTo('li:eq(15)', 1600, {queue:true, onAfterFirst:function() { } });//called after the first axis scrolled" id="settings-onAfterFirst" href="#">onAfterFirst</a></li>
234
+ </ul>
235
+ <h4>Settings inherited from <a href="http://api.jquery.com/animate/#animate-properties-options" target="_blank">$().animate()</a></h4>
236
+ <ul class="links">
237
+ <li><a title="$(...).scrollTo('li:eq(15)', {duration:3000});//another way of calling the plugin" id="settings-duration" href="#">duration</a></li>
238
+ <li><a title="$(...).scrollTo('li:eq(15)', 2500, {easing:'elasout'});//specify an easing equation" id="settings-easing" href="#">easing</a></li>
239
+ <li><a title="$(...).scrollTo('li:eq(15)', 1600, {queue:true});//scroll one axis, then the other" id="settings-queue" href="#">queue</a></li>
240
+ <li><a title="$(...).scrollTo('li:eq(15)', 2500, {step:function() { }'});//specify a step function" id="settings-step" href="#">step</a></li>
241
+ <li><a title="$(...).scrollTo('li:eq(15)', 2500, {progress:function() { }'});//specify a progress function" id="settings-progress" href="#">progress</a></li>
242
+ <li><a title="Scroll manually to interrupt and trigger the callback" id="settings-fail" href="#">fail</a></li>
243
+ <li><a href="http://api.jquery.com/animate/#animate-properties-options" target="_blank">more</a></li>
244
+ </ul>
245
+ <div id="pane-settings" class="pane">
246
+ <ul class="elements" style="height:1062px;width:1877px;">
247
+ <li><p>0</p><a href="#" title="$(...).scrollTo(0, 800, {queue:true});" class="back">go back</a></li><li><p>1</p><a href="#" title="$(...).scrollTo(0, 800, {queue:true});" class="back">go back</a></li><li><p>2</p><a href="#" title="$(...).scrollTo(0, 800, {queue:true});" class="back">go back</a></li><li><p>3</p><a href="#" title="$(...).scrollTo(0, 800, {queue:true});" class="back">go back</a></li><li><p>4</p><a href="#" title="$(...).scrollTo(0, 800, {queue:true});" class="back">go back</a></li><li><p>5</p><a href="#" title="$(...).scrollTo(0, 800, {queue:true});" class="back">go back</a></li><li><p>6</p><a href="#" title="$(...).scrollTo(0, 800, {queue:true});" class="back">go back</a></li><li><p>7</p><a href="#" title="$(...).scrollTo(0, 800, {queue:true});" class="back">go back</a></li><li><p>8</p><a href="#" title="$(...).scrollTo(0, 800, {queue:true});" class="back">go back</a></li><li><p>9</p><a href="#" title="$(...).scrollTo(0, 800, {queue:true});" class="back">go back</a></li><li><p>10</p><a href="#" title="$(...).scrollTo(0, 800, {queue:true});" class="back">go back</a></li><li><p>11</p><a href="#" title="$(...).scrollTo(0, 800, {queue:true});" class="back">go back</a></li><li><p>12</p><a href="#" title="$(...).scrollTo(0, 800, {queue:true});" class="back">go back</a></li><li><p>13</p><a href="#" title="$(...).scrollTo(0, 800, {queue:true});" class="back">go back</a></li><li><p>14</p><a href="#" title="$(...).scrollTo(0, 800, {queue:true});" class="back">go back</a></li><li><p>15</p><a href="#" title="$(...).scrollTo(0, 800, {queue:true});" class="back">go back</a></li><li><p>16</p><a href="#" title="$(...).scrollTo(0, 800, {queue:true});" class="back">go back</a></li><li><p>17</p><a href="#" title="$(...).scrollTo(0, 800, {queue:true});" class="back">go back</a></li><li><p>18</p><a href="#" title="$(...).scrollTo(0, 800, {queue:true});" class="back">go back</a></li><li><p>19</p><a href="#" title="$(...).scrollTo(0, 800, {queue:true});" class="back">go back</a></li><li><p>20</p><a href="#" title="$(...).scrollTo(0, 800, {queue:true});" class="back">go back</a></li><li><p>21</p><a href="#" title="$(...).scrollTo(0, 800, {queue:true});" class="back">go back</a></li><li><p>22</p><a href="#" title="$(...).scrollTo(0, 800, {queue:true});" class="back">go back</a></li><li><p>23</p><a href="#" title="$(...).scrollTo(0, 800, {queue:true});" class="back">go back</a></li><li><p>24</p><a href="#" title="$(...).scrollTo(0, 800, {queue:true});" class="back">go back</a></li><li><p>25</p><a href="#" title="$(...).scrollTo(0, 800, {queue:true});" class="back">go back</a></li><li><p>26</p><a href="#" title="$(...).scrollTo(0, 800, {queue:true});" class="back">go back</a></li><li><p>27</p><a href="#" title="$(...).scrollTo(0, 800, {queue:true});" class="back">go back</a></li><li><p>28</p><a href="#" title="$(...).scrollTo(0, 800, {queue:true});" class="back">go back</a></li><li><p>29</p><a href="#" title="$(...).scrollTo(0, 800, {queue:true});" class="back">go back</a></li>
248
+ </ul>
249
+ </div>
250
+ </div>
251
+ </body>
252
+ </html>