blinker / firefox.plugin / data / jquery.withinViewport.js @ a03cd52e
History | View | Annotate | Download (3.404 KB)
1 |
/**
|
---|---|
2 |
* Within Viewport jQuery Plugin
|
3 |
*
|
4 |
* @description Companion plugin for withinViewport.js
|
5 |
* @author Craig Patik, http://patik.com/
|
6 |
* @version 0.0.3
|
7 |
* @date 2014-03-03
|
8 |
*/
|
9 |
|
10 |
(function($) { |
11 |
/**
|
12 |
* $.withinViewport()
|
13 |
* @description jQuery method
|
14 |
* @param {Object} [settings] optional settings
|
15 |
* @return {Collection} Contains all elements that were within the viewport
|
16 |
*/
|
17 |
$.fn.withinViewport = function(settings) { |
18 |
if (typeof settings === "string") { settings = {sides: settings}; } |
19 |
|
20 |
var opts = $.extend({}, settings, {sides: "all"}), elems = []; |
21 |
|
22 |
this.each(function() { |
23 |
if (withinViewport(this, opts)) { |
24 |
elems.push(this);
|
25 |
} |
26 |
}); |
27 |
|
28 |
return $(elems); |
29 |
}; |
30 |
|
31 |
// Main custom selector
|
32 |
$.extend($.expr[":"], { |
33 |
"within-viewport": function(element) { |
34 |
return withinViewport(element, "all"); |
35 |
} |
36 |
}); |
37 |
|
38 |
/**
|
39 |
* Optional enhancements and shortcuts
|
40 |
*
|
41 |
* @description Uncomment or comment these pieces as they apply to your project and coding preferences
|
42 |
*/
|
43 |
|
44 |
// Shorthand jQuery methods
|
45 |
//
|
46 |
$.fn.withinViewportTop = function(settings) { |
47 |
var opts;
|
48 |
|
49 |
if (typeof settings === "string") { settings = {sides: settings}; } |
50 |
|
51 |
opts = $.extend({}, settings, {sides: "top"}), elems = []; |
52 |
|
53 |
this.each(function() { |
54 |
if (withinViewport(this, opts)) { |
55 |
elems.push(this);
|
56 |
} |
57 |
}); |
58 |
|
59 |
return $(elems); |
60 |
}; |
61 |
|
62 |
$.fn.withinViewportRight = function(settings) { |
63 |
var opts;
|
64 |
|
65 |
if (typeof settings === "string") { settings = {sides: settings}; } |
66 |
|
67 |
opts = $.extend({}, settings, {sides: "right"}), elems = []; |
68 |
|
69 |
this.each(function() { |
70 |
if (withinViewport(this, opts)) { |
71 |
elems.push(this);
|
72 |
} |
73 |
}); |
74 |
|
75 |
return $(elems); |
76 |
}; |
77 |
|
78 |
$.fn.withinViewportBottom = function(settings) { |
79 |
var opts;
|
80 |
|
81 |
if (typeof settings === "string") { settings = {sides: settings}; } |
82 |
|
83 |
opts = $.extend({}, settings, {sides: "bottom"}), elems = []; |
84 |
|
85 |
this.each(function() { |
86 |
if (withinViewport(this, opts)) { |
87 |
elems.push(this);
|
88 |
} |
89 |
}); |
90 |
|
91 |
return $(elems); |
92 |
}; |
93 |
|
94 |
$.fn.withinViewportLeft = function(settings) { |
95 |
var opts;
|
96 |
|
97 |
if (typeof settings === "string") { settings = {sides: settings}; } |
98 |
|
99 |
opts = $.extend({}, settings, {sides: "left"}), elems = []; |
100 |
|
101 |
this.each(function() { |
102 |
if (withinViewport(this, opts)) { |
103 |
elems.push(this);
|
104 |
} |
105 |
}); |
106 |
|
107 |
return $(elems); |
108 |
}; |
109 |
|
110 |
// Custom jQuery selectors
|
111 |
$.extend($.expr[":"], { |
112 |
"within-viewport-top": function(element) { |
113 |
return withinViewport(element, "top"); |
114 |
}, |
115 |
"within-viewport-right": function(element) { |
116 |
return withinViewport(element, "right"); |
117 |
}, |
118 |
"within-viewport-bottom": function(element) { |
119 |
return withinViewport(element, "bottom"); |
120 |
}, |
121 |
"within-viewport-left": function(element) { |
122 |
return withinViewport(element, "left"); |
123 |
} |
124 |
// Example custom selector:
|
125 |
//,
|
126 |
// "within-viewport-top-left-45": function(element) {
|
127 |
// return withinViewport(element, {sides:'top left', top: 45, left: 45});
|
128 |
// }
|
129 |
}); |
130 |
}(jQuery)); |