Lines 1-73
Link Here
|
1 |
/* Source: http://www.webspeaks.in/2011/07/new-gmail-like-floating-toolbar-jquery.html |
|
|
2 |
Revision: http://jsfiddle.net/pasmalin/AyjeZ/ |
3 |
*/ |
4 |
(function ($, window) { |
5 |
"use strict"; |
6 |
$.fn.fixFloat = function (options) { |
7 |
var options = options || {}; |
8 |
var tbh = $(this); |
9 |
var defaults = { |
10 |
enabled: true, |
11 |
originalOffset: tbh.offset().top, |
12 |
originalPosition: tbh.position().top, |
13 |
}; |
14 |
var originalOffset = typeof options.originalOffset === 'undefined' |
15 |
? defaults.originalOffset |
16 |
: options.originalOffset; |
17 |
|
18 |
var originalPosition = typeof options.originalPosition === 'undefined' |
19 |
? defaults.originalPosition |
20 |
: options.originalPosition; |
21 |
|
22 |
options = $.extend(defaults, options); |
23 |
|
24 |
if (tbh.css('position') !== 'absolute') { |
25 |
var tbhBis = tbh.clone(); |
26 |
tbhBis.css({ |
27 |
"display": tbh.css("display"), |
28 |
"visibility": "hidden" |
29 |
}); |
30 |
tbhBis.width(tbh.innerWidth(true)); |
31 |
tbhBis.height(tbh.height()); |
32 |
tbhBis.attr('id', tbh.attr('id')+'Bis'); // Avoid 2 elts with the same id |
33 |
tbh.after(tbhBis); |
34 |
tbh.width(tbh.width()); |
35 |
tbh.css({ |
36 |
'position': 'absolute', |
37 |
'top': originalPosition, |
38 |
}); |
39 |
} |
40 |
|
41 |
if (options.enabled) { |
42 |
$(window).scroll(function () { |
43 |
var offsetTop = tbh.offset().top; |
44 |
|
45 |
var s = parseInt($(window).scrollTop(), 10); |
46 |
|
47 |
var fixMe = (s > offsetTop); |
48 |
var repositionMe = (s < originalOffset); |
49 |
if (fixMe) { |
50 |
tbh.css({ |
51 |
'position': 'fixed', |
52 |
'top': '0', |
53 |
'z-index': '1000' |
54 |
}); |
55 |
tbh.addClass("floating"); |
56 |
} |
57 |
if (repositionMe) { |
58 |
tbh.css({ |
59 |
'position': 'absolute', |
60 |
'top': originalPosition, |
61 |
'z-index': '1' |
62 |
}); |
63 |
tbh.removeClass("floating"); |
64 |
} |
65 |
}); |
66 |
|
67 |
$(window).resize(function() { |
68 |
var p = $(tbh).parents('div').first(); |
69 |
$(tbh).width(p.width()-10); |
70 |
}); |
71 |
} |
72 |
}; |
73 |
})(jQuery, window); |
74 |
- |