jquery-scrolltofixed-rails 0.1.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- checksums.yaml +7 -0
- data/MIT-LICENSE +20 -0
- data/README.md +41 -0
- data/Rakefile +34 -0
- data/app/assets/config/jquery_scrolltofixed_rails_manifest.js +1 -0
- data/app/assets/javascripts/jquery-scrolltofixed-rails.js +567 -0
- data/app/assets/stylesheets/jquery/scrolltofixed/rails/application.css +15 -0
- data/app/controllers/jquery/scrolltofixed/rails/application_controller.rb +11 -0
- data/app/helpers/jquery/scrolltofixed/rails/application_helper.rb +10 -0
- data/app/jobs/jquery/scrolltofixed/rails/application_job.rb +10 -0
- data/app/mailers/jquery/scrolltofixed/rails/application_mailer.rb +12 -0
- data/app/models/jquery/scrolltofixed/rails/application_record.rb +11 -0
- data/app/views/layouts/jquery/scrolltofixed/rails/application.html.erb +15 -0
- data/config/routes.rb +4 -0
- data/lib/jquery/scrolltofixed/rails.rb +11 -0
- data/lib/jquery/scrolltofixed/rails/engine.rb +11 -0
- data/lib/jquery/scrolltofixed/rails/version.rb +9 -0
- data/lib/tasks/jquery/scrolltofixed/rails_tasks.rake +6 -0
- metadata +103 -0
checksums.yaml
ADDED
@@ -0,0 +1,7 @@
|
|
1
|
+
---
|
2
|
+
SHA256:
|
3
|
+
metadata.gz: '084ea6911acd41c3a61998aeb3ed259fdc35b04ff2bbf5a2464188431d4b45cf'
|
4
|
+
data.tar.gz: 43c443eeba468c06d084769059098ff20ae02712fc5238be92baebfc03cb5f02
|
5
|
+
SHA512:
|
6
|
+
metadata.gz: 2d6e4ba9335513f6482acde0bdec62b84d0651d6357e01718b617950bd2b79e63136e9ffc4de4c0075f1243a76a3081fce987b34a965713e3263d18a1743f6e7
|
7
|
+
data.tar.gz: e1fde4f909f819581407aa937f07b498da83a88d4e46d7cf41e3502df2e885f6605b49373d309e6b2650c8b70d88777ef40fc35fc208fb5183ce74e1934459f6
|
data/MIT-LICENSE
ADDED
@@ -0,0 +1,20 @@
|
|
1
|
+
Copyright 2018 Pablo Gonzaga
|
2
|
+
|
3
|
+
Permission is hereby granted, free of charge, to any person obtaining
|
4
|
+
a copy of this software and associated documentation files (the
|
5
|
+
"Software"), to deal in the Software without restriction, including
|
6
|
+
without limitation the rights to use, copy, modify, merge, publish,
|
7
|
+
distribute, sublicense, and/or sell copies of the Software, and to
|
8
|
+
permit persons to whom the Software is furnished to do so, subject to
|
9
|
+
the following conditions:
|
10
|
+
|
11
|
+
The above copyright notice and this permission notice shall be
|
12
|
+
included in all copies or substantial portions of the Software.
|
13
|
+
|
14
|
+
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
|
15
|
+
EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF
|
16
|
+
MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
|
17
|
+
NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE
|
18
|
+
LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION
|
19
|
+
OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION
|
20
|
+
WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
|
data/README.md
ADDED
@@ -0,0 +1,41 @@
|
|
1
|
+
# Jquery::Scrolltofixed::Rails
|
2
|
+
|
3
|
+
Integrate JQuery ScrollToFixed plugin into Rails.
|
4
|
+
|
5
|
+
## Usage
|
6
|
+
You can check the official documentation [here](https://github.com/bigspotteddog/ScrollToFixed#usage).
|
7
|
+
|
8
|
+
## Installation
|
9
|
+
NOTE: you have to install [jquery-rails](https://rubygems.org/gems/jquery-rails) gem to use this gem.
|
10
|
+
|
11
|
+
Add this line to your application's Gemfile:
|
12
|
+
|
13
|
+
```ruby
|
14
|
+
gem 'jquery-scrolltofixed-rails'
|
15
|
+
```
|
16
|
+
|
17
|
+
And then execute:
|
18
|
+
```bash
|
19
|
+
$ bundle
|
20
|
+
```
|
21
|
+
|
22
|
+
Or install it yourself as:
|
23
|
+
```bash
|
24
|
+
$ gem install jquery-scrolltofixed-rails
|
25
|
+
```
|
26
|
+
|
27
|
+
Copy:
|
28
|
+
|
29
|
+
```
|
30
|
+
//=require jquery-scrolltofixed-rails
|
31
|
+
```
|
32
|
+
In your:
|
33
|
+
```
|
34
|
+
assets/javascripts/application.js
|
35
|
+
```
|
36
|
+
|
37
|
+
## Contributing
|
38
|
+
Just create a PR.
|
39
|
+
|
40
|
+
## License
|
41
|
+
The gem is available as open source under the terms of the [MIT License](https://opensource.org/licenses/MIT).
|
data/Rakefile
ADDED
@@ -0,0 +1,34 @@
|
|
1
|
+
# frozen_string_literal: true
|
2
|
+
|
3
|
+
begin
|
4
|
+
require 'bundler/setup'
|
5
|
+
rescue LoadError
|
6
|
+
puts 'You must `gem install bundler` and `bundle install` to run rake tasks'
|
7
|
+
end
|
8
|
+
|
9
|
+
require 'rdoc/task'
|
10
|
+
|
11
|
+
RDoc::Task.new(:rdoc) do |rdoc|
|
12
|
+
rdoc.rdoc_dir = 'rdoc'
|
13
|
+
rdoc.title = 'Jquery::Scrolltofixed::Rails'
|
14
|
+
rdoc.options << '--line-numbers'
|
15
|
+
rdoc.rdoc_files.include('README.md')
|
16
|
+
rdoc.rdoc_files.include('lib/**/*.rb')
|
17
|
+
end
|
18
|
+
|
19
|
+
APP_RAKEFILE = File.expand_path('test/dummy/Rakefile', __dir__)
|
20
|
+
load 'rails/tasks/engine.rake'
|
21
|
+
|
22
|
+
load 'rails/tasks/statistics.rake'
|
23
|
+
|
24
|
+
require 'bundler/gem_tasks'
|
25
|
+
|
26
|
+
require 'rake/testtask'
|
27
|
+
|
28
|
+
Rake::TestTask.new(:test) do |t|
|
29
|
+
t.libs << 'test'
|
30
|
+
t.pattern = 'test/**/*_test.rb'
|
31
|
+
t.verbose = false
|
32
|
+
end
|
33
|
+
|
34
|
+
task default: :test
|
@@ -0,0 +1 @@
|
|
1
|
+
|
@@ -0,0 +1,567 @@
|
|
1
|
+
/*
|
2
|
+
* ScrollToFixed
|
3
|
+
* https://github.com/bigspotteddog/ScrollToFixed
|
4
|
+
*
|
5
|
+
* Copyright (c) 2011 Joseph Cava-Lynch
|
6
|
+
* MIT license
|
7
|
+
*/
|
8
|
+
(function($) {
|
9
|
+
$.isScrollToFixed = function(el) {
|
10
|
+
return !!$(el).data('ScrollToFixed');
|
11
|
+
};
|
12
|
+
|
13
|
+
$.ScrollToFixed = function(el, options) {
|
14
|
+
// To avoid scope issues, use 'base' instead of 'this' to reference this
|
15
|
+
// class from internal events and functions.
|
16
|
+
var base = this;
|
17
|
+
|
18
|
+
// Access to jQuery and DOM versions of element.
|
19
|
+
base.$el = $(el);
|
20
|
+
base.el = el;
|
21
|
+
|
22
|
+
// Add a reverse reference to the DOM object.
|
23
|
+
base.$el.data('ScrollToFixed', base);
|
24
|
+
|
25
|
+
// A flag so we know if the scroll has been reset.
|
26
|
+
var isReset = false;
|
27
|
+
|
28
|
+
// The element that was given to us to fix if scrolled above the top of
|
29
|
+
// the page.
|
30
|
+
var target = base.$el;
|
31
|
+
|
32
|
+
var position;
|
33
|
+
var originalPosition;
|
34
|
+
var originalFloat;
|
35
|
+
var originalOffsetTop;
|
36
|
+
var originalZIndex;
|
37
|
+
|
38
|
+
// The offset top of the element when resetScroll was called. This is
|
39
|
+
// used to determine if we have scrolled past the top of the element.
|
40
|
+
var offsetTop = 0;
|
41
|
+
|
42
|
+
// The offset left of the element when resetScroll was called. This is
|
43
|
+
// used to move the element left or right relative to the horizontal
|
44
|
+
// scroll.
|
45
|
+
var offsetLeft = 0;
|
46
|
+
var originalOffsetLeft = -1;
|
47
|
+
|
48
|
+
// This last offset used to move the element horizontally. This is used
|
49
|
+
// to determine if we need to move the element because we would not want
|
50
|
+
// to do that for no reason.
|
51
|
+
var lastOffsetLeft = -1;
|
52
|
+
|
53
|
+
// This is the element used to fill the void left by the target element
|
54
|
+
// when it goes fixed; otherwise, everything below it moves up the page.
|
55
|
+
var spacer = null;
|
56
|
+
|
57
|
+
var spacerClass;
|
58
|
+
|
59
|
+
var className;
|
60
|
+
|
61
|
+
// Capture the original offsets for the target element. This needs to be
|
62
|
+
// called whenever the page size changes or when the page is first
|
63
|
+
// scrolled. For some reason, calling this before the page is first
|
64
|
+
// scrolled causes the element to become fixed too late.
|
65
|
+
function resetScroll() {
|
66
|
+
// Set the element to it original positioning.
|
67
|
+
target.trigger('preUnfixed.ScrollToFixed');
|
68
|
+
setUnfixed();
|
69
|
+
target.trigger('unfixed.ScrollToFixed');
|
70
|
+
|
71
|
+
// Reset the last offset used to determine if the page has moved
|
72
|
+
// horizontally.
|
73
|
+
lastOffsetLeft = -1;
|
74
|
+
|
75
|
+
// Capture the offset top of the target element.
|
76
|
+
offsetTop = target.offset().top;
|
77
|
+
|
78
|
+
// Capture the offset left of the target element.
|
79
|
+
offsetLeft = target.offset().left;
|
80
|
+
|
81
|
+
// If the offsets option is on, alter the left offset.
|
82
|
+
if (base.options.offsets) {
|
83
|
+
offsetLeft += (target.offset().left - target.position().left);
|
84
|
+
}
|
85
|
+
|
86
|
+
if (originalOffsetLeft == -1) {
|
87
|
+
originalOffsetLeft = offsetLeft;
|
88
|
+
}
|
89
|
+
|
90
|
+
position = target.css('position');
|
91
|
+
|
92
|
+
// Set that this has been called at least once.
|
93
|
+
isReset = true;
|
94
|
+
|
95
|
+
if (base.options.bottom != -1) {
|
96
|
+
target.trigger('preFixed.ScrollToFixed');
|
97
|
+
setFixed();
|
98
|
+
target.trigger('fixed.ScrollToFixed');
|
99
|
+
}
|
100
|
+
}
|
101
|
+
|
102
|
+
function getLimit() {
|
103
|
+
var limit = base.options.limit;
|
104
|
+
if (!limit) return 0;
|
105
|
+
|
106
|
+
if (typeof(limit) === 'function') {
|
107
|
+
return limit.apply(target);
|
108
|
+
}
|
109
|
+
return limit;
|
110
|
+
}
|
111
|
+
|
112
|
+
// Returns whether the target element is fixed or not.
|
113
|
+
function isFixed() {
|
114
|
+
return position === 'fixed';
|
115
|
+
}
|
116
|
+
|
117
|
+
// Returns whether the target element is absolute or not.
|
118
|
+
function isAbsolute() {
|
119
|
+
return position === 'absolute';
|
120
|
+
}
|
121
|
+
|
122
|
+
function isUnfixed() {
|
123
|
+
return !(isFixed() || isAbsolute());
|
124
|
+
}
|
125
|
+
|
126
|
+
// Sets the target element to fixed. Also, sets the spacer to fill the
|
127
|
+
// void left by the target element.
|
128
|
+
function setFixed() {
|
129
|
+
// Only fix the target element and the spacer if we need to.
|
130
|
+
if (!isFixed()) {
|
131
|
+
//get REAL dimensions (decimal fix)
|
132
|
+
//Ref. http://stackoverflow.com/questions/3603065/how-to-make-jquery-to-not-round-value-returned-by-width
|
133
|
+
var dimensions = target[0].getBoundingClientRect();
|
134
|
+
|
135
|
+
// Set the spacer to fill the height and width of the target
|
136
|
+
// element, then display it.
|
137
|
+
spacer.css({
|
138
|
+
'display' : target.css('display'),
|
139
|
+
'width' : dimensions.width,
|
140
|
+
'height' : dimensions.height,
|
141
|
+
'float' : target.css('float')
|
142
|
+
});
|
143
|
+
|
144
|
+
// Set the target element to fixed and set its width so it does
|
145
|
+
// not fill the rest of the page horizontally. Also, set its top
|
146
|
+
// to the margin top specified in the options.
|
147
|
+
|
148
|
+
cssOptions={
|
149
|
+
'z-index' : base.options.zIndex,
|
150
|
+
'position' : 'fixed',
|
151
|
+
'top' : base.options.bottom == -1?getMarginTop():'',
|
152
|
+
'bottom' : base.options.bottom == -1?'':base.options.bottom,
|
153
|
+
'margin-left' : '0px'
|
154
|
+
}
|
155
|
+
if (!base.options.dontSetWidth){ cssOptions['width']=target.css('width'); };
|
156
|
+
|
157
|
+
target.css(cssOptions);
|
158
|
+
|
159
|
+
target.addClass(base.options.baseClassName);
|
160
|
+
|
161
|
+
if (base.options.className) {
|
162
|
+
target.addClass(base.options.className);
|
163
|
+
}
|
164
|
+
|
165
|
+
position = 'fixed';
|
166
|
+
}
|
167
|
+
}
|
168
|
+
|
169
|
+
function setAbsolute() {
|
170
|
+
|
171
|
+
var top = getLimit();
|
172
|
+
var left = offsetLeft;
|
173
|
+
|
174
|
+
if (base.options.removeOffsets) {
|
175
|
+
left = '';
|
176
|
+
top = top - offsetTop;
|
177
|
+
}
|
178
|
+
|
179
|
+
cssOptions={
|
180
|
+
'position' : 'absolute',
|
181
|
+
'top' : top,
|
182
|
+
'left' : left,
|
183
|
+
'margin-left' : '0px',
|
184
|
+
'bottom' : ''
|
185
|
+
}
|
186
|
+
if (!base.options.dontSetWidth){ cssOptions['width']=target.css('width'); };
|
187
|
+
|
188
|
+
target.css(cssOptions);
|
189
|
+
|
190
|
+
position = 'absolute';
|
191
|
+
}
|
192
|
+
|
193
|
+
// Sets the target element back to unfixed. Also, hides the spacer.
|
194
|
+
function setUnfixed() {
|
195
|
+
// Only unfix the target element and the spacer if we need to.
|
196
|
+
if (!isUnfixed()) {
|
197
|
+
lastOffsetLeft = -1;
|
198
|
+
|
199
|
+
// Hide the spacer now that the target element will fill the
|
200
|
+
// space.
|
201
|
+
spacer.css('display', 'none');
|
202
|
+
|
203
|
+
// Remove the style attributes that were added to the target.
|
204
|
+
// This will reverse the target back to the its original style.
|
205
|
+
target.css({
|
206
|
+
'z-index' : originalZIndex,
|
207
|
+
'width' : '',
|
208
|
+
'position' : originalPosition,
|
209
|
+
'left' : '',
|
210
|
+
'top' : originalOffsetTop,
|
211
|
+
'margin-left' : ''
|
212
|
+
});
|
213
|
+
|
214
|
+
target.removeClass('scroll-to-fixed-fixed');
|
215
|
+
|
216
|
+
if (base.options.className) {
|
217
|
+
target.removeClass(base.options.className);
|
218
|
+
}
|
219
|
+
|
220
|
+
position = null;
|
221
|
+
}
|
222
|
+
}
|
223
|
+
|
224
|
+
// Moves the target element left or right relative to the horizontal
|
225
|
+
// scroll position.
|
226
|
+
function setLeft(x) {
|
227
|
+
// Only if the scroll is not what it was last time we did this.
|
228
|
+
if (x != lastOffsetLeft) {
|
229
|
+
// Move the target element horizontally relative to its original
|
230
|
+
// horizontal position.
|
231
|
+
target.css('left', offsetLeft - x);
|
232
|
+
|
233
|
+
// Hold the last horizontal position set.
|
234
|
+
lastOffsetLeft = x;
|
235
|
+
}
|
236
|
+
}
|
237
|
+
|
238
|
+
function getMarginTop() {
|
239
|
+
var marginTop = base.options.marginTop;
|
240
|
+
if (!marginTop) return 0;
|
241
|
+
|
242
|
+
if (typeof(marginTop) === 'function') {
|
243
|
+
return marginTop.apply(target);
|
244
|
+
}
|
245
|
+
return marginTop;
|
246
|
+
}
|
247
|
+
|
248
|
+
// Checks to see if we need to do something based on new scroll position
|
249
|
+
// of the page.
|
250
|
+
function checkScroll() {
|
251
|
+
if (!$.isScrollToFixed(target) || target.is(':hidden')) return;
|
252
|
+
var wasReset = isReset;
|
253
|
+
var wasUnfixed = isUnfixed();
|
254
|
+
|
255
|
+
// If resetScroll has not yet been called, call it. This only
|
256
|
+
// happens once.
|
257
|
+
if (!isReset) {
|
258
|
+
resetScroll();
|
259
|
+
} else if (isUnfixed()) {
|
260
|
+
// if the offset has changed since the last scroll,
|
261
|
+
// we need to get it again.
|
262
|
+
|
263
|
+
// Capture the offset top of the target element.
|
264
|
+
offsetTop = target.offset().top;
|
265
|
+
|
266
|
+
// Capture the offset left of the target element.
|
267
|
+
offsetLeft = target.offset().left;
|
268
|
+
}
|
269
|
+
|
270
|
+
// Grab the current horizontal scroll position.
|
271
|
+
var x = $(window).scrollLeft();
|
272
|
+
|
273
|
+
// Grab the current vertical scroll position.
|
274
|
+
var y = $(window).scrollTop();
|
275
|
+
|
276
|
+
// Get the limit, if there is one.
|
277
|
+
var limit = getLimit();
|
278
|
+
|
279
|
+
// If the vertical scroll position, plus the optional margin, would
|
280
|
+
// put the target element at the specified limit, set the target
|
281
|
+
// element to absolute.
|
282
|
+
if (base.options.minWidth && $(window).width() < base.options.minWidth) {
|
283
|
+
if (!isUnfixed() || !wasReset) {
|
284
|
+
postPosition();
|
285
|
+
target.trigger('preUnfixed.ScrollToFixed');
|
286
|
+
setUnfixed();
|
287
|
+
target.trigger('unfixed.ScrollToFixed');
|
288
|
+
}
|
289
|
+
} else if (base.options.maxWidth && $(window).width() > base.options.maxWidth) {
|
290
|
+
if (!isUnfixed() || !wasReset) {
|
291
|
+
postPosition();
|
292
|
+
target.trigger('preUnfixed.ScrollToFixed');
|
293
|
+
setUnfixed();
|
294
|
+
target.trigger('unfixed.ScrollToFixed');
|
295
|
+
}
|
296
|
+
} else if (base.options.bottom == -1) {
|
297
|
+
// If the vertical scroll position, plus the optional margin, would
|
298
|
+
// put the target element at the specified limit, set the target
|
299
|
+
// element to absolute.
|
300
|
+
if (limit > 0 && y >= limit - getMarginTop()) {
|
301
|
+
if (!wasUnfixed && (!isAbsolute() || !wasReset)) {
|
302
|
+
postPosition();
|
303
|
+
target.trigger('preAbsolute.ScrollToFixed');
|
304
|
+
setAbsolute();
|
305
|
+
target.trigger('unfixed.ScrollToFixed');
|
306
|
+
}
|
307
|
+
// If the vertical scroll position, plus the optional margin, would
|
308
|
+
// put the target element above the top of the page, set the target
|
309
|
+
// element to fixed.
|
310
|
+
} else if (y >= offsetTop - getMarginTop()) {
|
311
|
+
if (!isFixed() || !wasReset) {
|
312
|
+
postPosition();
|
313
|
+
target.trigger('preFixed.ScrollToFixed');
|
314
|
+
|
315
|
+
// Set the target element to fixed.
|
316
|
+
setFixed();
|
317
|
+
|
318
|
+
// Reset the last offset left because we just went fixed.
|
319
|
+
lastOffsetLeft = -1;
|
320
|
+
|
321
|
+
target.trigger('fixed.ScrollToFixed');
|
322
|
+
}
|
323
|
+
// If the page has been scrolled horizontally as well, move the
|
324
|
+
// target element accordingly.
|
325
|
+
setLeft(x);
|
326
|
+
} else {
|
327
|
+
// Set the target element to unfixed, placing it where it was
|
328
|
+
// before.
|
329
|
+
if (!isUnfixed() || !wasReset) {
|
330
|
+
postPosition();
|
331
|
+
target.trigger('preUnfixed.ScrollToFixed');
|
332
|
+
setUnfixed();
|
333
|
+
target.trigger('unfixed.ScrollToFixed');
|
334
|
+
}
|
335
|
+
}
|
336
|
+
} else {
|
337
|
+
if (limit > 0) {
|
338
|
+
if (y + $(window).height() - target.outerHeight(true) >= limit - (getMarginTop() || -getBottom())) {
|
339
|
+
if (isFixed()) {
|
340
|
+
postPosition();
|
341
|
+
target.trigger('preUnfixed.ScrollToFixed');
|
342
|
+
|
343
|
+
if (originalPosition === 'absolute') {
|
344
|
+
setAbsolute();
|
345
|
+
} else {
|
346
|
+
setUnfixed();
|
347
|
+
}
|
348
|
+
|
349
|
+
target.trigger('unfixed.ScrollToFixed');
|
350
|
+
}
|
351
|
+
} else {
|
352
|
+
if (!isFixed()) {
|
353
|
+
postPosition();
|
354
|
+
target.trigger('preFixed.ScrollToFixed');
|
355
|
+
setFixed();
|
356
|
+
}
|
357
|
+
setLeft(x);
|
358
|
+
target.trigger('fixed.ScrollToFixed');
|
359
|
+
}
|
360
|
+
} else {
|
361
|
+
setLeft(x);
|
362
|
+
}
|
363
|
+
}
|
364
|
+
}
|
365
|
+
|
366
|
+
function getBottom() {
|
367
|
+
if (!base.options.bottom) return 0;
|
368
|
+
return base.options.bottom;
|
369
|
+
}
|
370
|
+
|
371
|
+
function postPosition() {
|
372
|
+
var position = target.css('position');
|
373
|
+
|
374
|
+
if (position == 'absolute') {
|
375
|
+
target.trigger('postAbsolute.ScrollToFixed');
|
376
|
+
} else if (position == 'fixed') {
|
377
|
+
target.trigger('postFixed.ScrollToFixed');
|
378
|
+
} else {
|
379
|
+
target.trigger('postUnfixed.ScrollToFixed');
|
380
|
+
}
|
381
|
+
}
|
382
|
+
|
383
|
+
var windowResize = function(event) {
|
384
|
+
// Check if the element is visible before updating it's position, which
|
385
|
+
// improves behavior with responsive designs where this element is hidden.
|
386
|
+
if(target.is(':visible')) {
|
387
|
+
isReset = false;
|
388
|
+
checkScroll();
|
389
|
+
} else {
|
390
|
+
// Ensure the spacer is hidden
|
391
|
+
setUnfixed();
|
392
|
+
}
|
393
|
+
}
|
394
|
+
|
395
|
+
var windowScroll = function(event) {
|
396
|
+
(!!window.requestAnimationFrame) ? requestAnimationFrame(checkScroll) : checkScroll();
|
397
|
+
}
|
398
|
+
|
399
|
+
// From: http://kangax.github.com/cft/#IS_POSITION_FIXED_SUPPORTED
|
400
|
+
var isPositionFixedSupported = function() {
|
401
|
+
var container = document.body;
|
402
|
+
|
403
|
+
if (document.createElement && container && container.appendChild && container.removeChild) {
|
404
|
+
var el = document.createElement('div');
|
405
|
+
|
406
|
+
if (!el.getBoundingClientRect) return null;
|
407
|
+
|
408
|
+
el.innerHTML = 'x';
|
409
|
+
el.style.cssText = 'position:fixed;top:100px;';
|
410
|
+
container.appendChild(el);
|
411
|
+
|
412
|
+
var originalHeight = container.style.height,
|
413
|
+
originalScrollTop = container.scrollTop;
|
414
|
+
|
415
|
+
container.style.height = '3000px';
|
416
|
+
container.scrollTop = 500;
|
417
|
+
|
418
|
+
var elementTop = el.getBoundingClientRect().top;
|
419
|
+
container.style.height = originalHeight;
|
420
|
+
|
421
|
+
var isSupported = (elementTop === 100);
|
422
|
+
container.removeChild(el);
|
423
|
+
container.scrollTop = originalScrollTop;
|
424
|
+
|
425
|
+
return isSupported;
|
426
|
+
}
|
427
|
+
|
428
|
+
return null;
|
429
|
+
}
|
430
|
+
|
431
|
+
var preventDefault = function(e) {
|
432
|
+
e = e || window.event;
|
433
|
+
if (e.preventDefault) {
|
434
|
+
e.preventDefault();
|
435
|
+
}
|
436
|
+
e.returnValue = false;
|
437
|
+
}
|
438
|
+
|
439
|
+
// Initializes this plugin. Captures the options passed in, turns this
|
440
|
+
// off for devices that do not support fixed position, adds the spacer,
|
441
|
+
// and binds to the window scroll and resize events.
|
442
|
+
base.init = function() {
|
443
|
+
// Capture the options for this plugin.
|
444
|
+
base.options = $.extend({}, $.ScrollToFixed.defaultOptions, options);
|
445
|
+
|
446
|
+
originalZIndex = target.css('z-index')
|
447
|
+
|
448
|
+
// Turn off this functionality for devices that do not support it.
|
449
|
+
// if (!(base.options && base.options.dontCheckForPositionFixedSupport)) {
|
450
|
+
// var fixedSupported = isPositionFixedSupported();
|
451
|
+
// if (!fixedSupported) return;
|
452
|
+
// }
|
453
|
+
|
454
|
+
// Put the target element on top of everything that could be below
|
455
|
+
// it. This reduces flicker when the target element is transitioning
|
456
|
+
// to fixed.
|
457
|
+
base.$el.css('z-index', base.options.zIndex);
|
458
|
+
|
459
|
+
// Create a spacer element to fill the void left by the target
|
460
|
+
// element when it goes fixed.
|
461
|
+
spacer = $('<div />');
|
462
|
+
|
463
|
+
position = target.css('position');
|
464
|
+
originalPosition = target.css('position');
|
465
|
+
originalFloat = target.css('float');
|
466
|
+
originalOffsetTop = target.css('top');
|
467
|
+
|
468
|
+
// Place the spacer right after the target element.
|
469
|
+
if (isUnfixed()) base.$el.after(spacer);
|
470
|
+
|
471
|
+
// Reset the target element offsets when the window is resized, then
|
472
|
+
// check to see if we need to fix or unfix the target element.
|
473
|
+
$(window).bind('resize.ScrollToFixed', windowResize);
|
474
|
+
|
475
|
+
// When the window scrolls, check to see if we need to fix or unfix
|
476
|
+
// the target element.
|
477
|
+
$(window).bind('scroll.ScrollToFixed', windowScroll);
|
478
|
+
|
479
|
+
// For touch devices, call checkScroll directlly rather than
|
480
|
+
// rAF wrapped windowScroll to animate the element
|
481
|
+
if ('ontouchmove' in window) {
|
482
|
+
$(window).bind('touchmove.ScrollToFixed', checkScroll);
|
483
|
+
}
|
484
|
+
|
485
|
+
if (base.options.preFixed) {
|
486
|
+
target.bind('preFixed.ScrollToFixed', base.options.preFixed);
|
487
|
+
}
|
488
|
+
if (base.options.postFixed) {
|
489
|
+
target.bind('postFixed.ScrollToFixed', base.options.postFixed);
|
490
|
+
}
|
491
|
+
if (base.options.preUnfixed) {
|
492
|
+
target.bind('preUnfixed.ScrollToFixed', base.options.preUnfixed);
|
493
|
+
}
|
494
|
+
if (base.options.postUnfixed) {
|
495
|
+
target.bind('postUnfixed.ScrollToFixed', base.options.postUnfixed);
|
496
|
+
}
|
497
|
+
if (base.options.preAbsolute) {
|
498
|
+
target.bind('preAbsolute.ScrollToFixed', base.options.preAbsolute);
|
499
|
+
}
|
500
|
+
if (base.options.postAbsolute) {
|
501
|
+
target.bind('postAbsolute.ScrollToFixed', base.options.postAbsolute);
|
502
|
+
}
|
503
|
+
if (base.options.fixed) {
|
504
|
+
target.bind('fixed.ScrollToFixed', base.options.fixed);
|
505
|
+
}
|
506
|
+
if (base.options.unfixed) {
|
507
|
+
target.bind('unfixed.ScrollToFixed', base.options.unfixed);
|
508
|
+
}
|
509
|
+
|
510
|
+
if (base.options.spacerClass) {
|
511
|
+
spacer.addClass(base.options.spacerClass);
|
512
|
+
}
|
513
|
+
|
514
|
+
target.bind('resize.ScrollToFixed', function() {
|
515
|
+
spacer.height(target.height());
|
516
|
+
});
|
517
|
+
|
518
|
+
target.bind('scroll.ScrollToFixed', function() {
|
519
|
+
target.trigger('preUnfixed.ScrollToFixed');
|
520
|
+
setUnfixed();
|
521
|
+
target.trigger('unfixed.ScrollToFixed');
|
522
|
+
checkScroll();
|
523
|
+
});
|
524
|
+
|
525
|
+
target.bind('detach.ScrollToFixed', function(ev) {
|
526
|
+
preventDefault(ev);
|
527
|
+
|
528
|
+
target.trigger('preUnfixed.ScrollToFixed');
|
529
|
+
setUnfixed();
|
530
|
+
target.trigger('unfixed.ScrollToFixed');
|
531
|
+
|
532
|
+
$(window).unbind('resize.ScrollToFixed', windowResize);
|
533
|
+
$(window).unbind('scroll.ScrollToFixed', windowScroll);
|
534
|
+
|
535
|
+
target.unbind('.ScrollToFixed');
|
536
|
+
|
537
|
+
//remove spacer from dom
|
538
|
+
spacer.remove();
|
539
|
+
|
540
|
+
base.$el.removeData('ScrollToFixed');
|
541
|
+
});
|
542
|
+
|
543
|
+
// Reset everything.
|
544
|
+
windowResize();
|
545
|
+
};
|
546
|
+
|
547
|
+
// Initialize the plugin.
|
548
|
+
base.init();
|
549
|
+
};
|
550
|
+
|
551
|
+
// Sets the option defaults.
|
552
|
+
$.ScrollToFixed.defaultOptions = {
|
553
|
+
marginTop : 0,
|
554
|
+
limit : 0,
|
555
|
+
bottom : -1,
|
556
|
+
zIndex : 1000,
|
557
|
+
baseClassName: 'scroll-to-fixed-fixed'
|
558
|
+
};
|
559
|
+
|
560
|
+
// Returns enhanced elements that will fix to the top of the page when the
|
561
|
+
// page is scrolled.
|
562
|
+
$.fn.scrollToFixed = function(options) {
|
563
|
+
return this.each(function() {
|
564
|
+
(new $.ScrollToFixed(this, options));
|
565
|
+
});
|
566
|
+
};
|
567
|
+
})(jQuery);
|
@@ -0,0 +1,15 @@
|
|
1
|
+
/*
|
2
|
+
* This is a manifest file that'll be compiled into application.css, which will include all the files
|
3
|
+
* listed below.
|
4
|
+
*
|
5
|
+
* Any CSS and SCSS file within this directory, lib/assets/stylesheets, vendor/assets/stylesheets,
|
6
|
+
* or any plugin's vendor/assets/stylesheets directory can be referenced here using a relative path.
|
7
|
+
*
|
8
|
+
* You're free to add application-wide styles to this file and they'll appear at the bottom of the
|
9
|
+
* compiled file so the styles you add here take precedence over styles defined in any other CSS/SCSS
|
10
|
+
* files in this directory. Styles in this file should be added after the last require_* statement.
|
11
|
+
* It is generally better to create a new file per style scope.
|
12
|
+
*
|
13
|
+
*= require_tree .
|
14
|
+
*= require_self
|
15
|
+
*/
|
@@ -0,0 +1,15 @@
|
|
1
|
+
<!DOCTYPE html>
|
2
|
+
<html>
|
3
|
+
<head>
|
4
|
+
<title>Jquery scrolltofixed rails</title>
|
5
|
+
<%= csrf_meta_tags %>
|
6
|
+
<%= csp_meta_tag %>
|
7
|
+
|
8
|
+
<%= stylesheet_link_tag "jquery/scrolltofixed/rails/application", media: "all" %>
|
9
|
+
</head>
|
10
|
+
<body>
|
11
|
+
|
12
|
+
<%= yield %>
|
13
|
+
|
14
|
+
</body>
|
15
|
+
</html>
|
data/config/routes.rb
ADDED
metadata
ADDED
@@ -0,0 +1,103 @@
|
|
1
|
+
--- !ruby/object:Gem::Specification
|
2
|
+
name: jquery-scrolltofixed-rails
|
3
|
+
version: !ruby/object:Gem::Version
|
4
|
+
version: 0.1.0
|
5
|
+
platform: ruby
|
6
|
+
authors:
|
7
|
+
- Pablo Gonzaga
|
8
|
+
autorequire:
|
9
|
+
bindir: bin
|
10
|
+
cert_chain: []
|
11
|
+
date: 2018-08-16 00:00:00.000000000 Z
|
12
|
+
dependencies:
|
13
|
+
- !ruby/object:Gem::Dependency
|
14
|
+
name: rails
|
15
|
+
requirement: !ruby/object:Gem::Requirement
|
16
|
+
requirements:
|
17
|
+
- - "~>"
|
18
|
+
- !ruby/object:Gem::Version
|
19
|
+
version: 5.2.1
|
20
|
+
type: :runtime
|
21
|
+
prerelease: false
|
22
|
+
version_requirements: !ruby/object:Gem::Requirement
|
23
|
+
requirements:
|
24
|
+
- - "~>"
|
25
|
+
- !ruby/object:Gem::Version
|
26
|
+
version: 5.2.1
|
27
|
+
- !ruby/object:Gem::Dependency
|
28
|
+
name: rubocop
|
29
|
+
requirement: !ruby/object:Gem::Requirement
|
30
|
+
requirements:
|
31
|
+
- - ">="
|
32
|
+
- !ruby/object:Gem::Version
|
33
|
+
version: '0'
|
34
|
+
type: :development
|
35
|
+
prerelease: false
|
36
|
+
version_requirements: !ruby/object:Gem::Requirement
|
37
|
+
requirements:
|
38
|
+
- - ">="
|
39
|
+
- !ruby/object:Gem::Version
|
40
|
+
version: '0'
|
41
|
+
- !ruby/object:Gem::Dependency
|
42
|
+
name: sqlite3
|
43
|
+
requirement: !ruby/object:Gem::Requirement
|
44
|
+
requirements:
|
45
|
+
- - ">="
|
46
|
+
- !ruby/object:Gem::Version
|
47
|
+
version: '0'
|
48
|
+
type: :development
|
49
|
+
prerelease: false
|
50
|
+
version_requirements: !ruby/object:Gem::Requirement
|
51
|
+
requirements:
|
52
|
+
- - ">="
|
53
|
+
- !ruby/object:Gem::Version
|
54
|
+
version: '0'
|
55
|
+
description: Integrates JQuery ScrollToFixed to Rails Sprockets
|
56
|
+
email:
|
57
|
+
- pgonzaga.uy@gmail.com
|
58
|
+
executables: []
|
59
|
+
extensions: []
|
60
|
+
extra_rdoc_files: []
|
61
|
+
files:
|
62
|
+
- MIT-LICENSE
|
63
|
+
- README.md
|
64
|
+
- Rakefile
|
65
|
+
- app/assets/config/jquery_scrolltofixed_rails_manifest.js
|
66
|
+
- app/assets/javascripts/jquery-scrolltofixed-rails.js
|
67
|
+
- app/assets/stylesheets/jquery/scrolltofixed/rails/application.css
|
68
|
+
- app/controllers/jquery/scrolltofixed/rails/application_controller.rb
|
69
|
+
- app/helpers/jquery/scrolltofixed/rails/application_helper.rb
|
70
|
+
- app/jobs/jquery/scrolltofixed/rails/application_job.rb
|
71
|
+
- app/mailers/jquery/scrolltofixed/rails/application_mailer.rb
|
72
|
+
- app/models/jquery/scrolltofixed/rails/application_record.rb
|
73
|
+
- app/views/layouts/jquery/scrolltofixed/rails/application.html.erb
|
74
|
+
- config/routes.rb
|
75
|
+
- lib/jquery/scrolltofixed/rails.rb
|
76
|
+
- lib/jquery/scrolltofixed/rails/engine.rb
|
77
|
+
- lib/jquery/scrolltofixed/rails/version.rb
|
78
|
+
- lib/tasks/jquery/scrolltofixed/rails_tasks.rake
|
79
|
+
homepage: https://github.com/pgonzaga/jquery-scrolltofixed-rails
|
80
|
+
licenses:
|
81
|
+
- MIT
|
82
|
+
metadata: {}
|
83
|
+
post_install_message:
|
84
|
+
rdoc_options: []
|
85
|
+
require_paths:
|
86
|
+
- lib
|
87
|
+
required_ruby_version: !ruby/object:Gem::Requirement
|
88
|
+
requirements:
|
89
|
+
- - ">="
|
90
|
+
- !ruby/object:Gem::Version
|
91
|
+
version: '0'
|
92
|
+
required_rubygems_version: !ruby/object:Gem::Requirement
|
93
|
+
requirements:
|
94
|
+
- - ">="
|
95
|
+
- !ruby/object:Gem::Version
|
96
|
+
version: '0'
|
97
|
+
requirements: []
|
98
|
+
rubyforge_project:
|
99
|
+
rubygems_version: 2.7.6
|
100
|
+
signing_key:
|
101
|
+
specification_version: 4
|
102
|
+
summary: JQuery ScrollToFixed Rails integration
|
103
|
+
test_files: []
|