Details | Last modification | View Log | RSS feed
| Rev | Author | Line No. | Line |
|---|---|---|---|
| 1 | espaco | 1 | /* |
| 2 | Plugin: jQuery Parallax |
||
| 3 | Version 1.1.3 |
||
| 4 | Author: Ian Lunn |
||
| 5 | Twitter: @IanLunn |
||
| 6 | Author URL: http://www.ianlunn.co.uk/ |
||
| 7 | Plugin URL: http://www.ianlunn.co.uk/plugins/jquery-parallax/ |
||
| 8 | |||
| 9 | Dual licensed under the MIT and GPL licenses: |
||
| 10 | http://www.opensource.org/licenses/mit-license.php |
||
| 11 | http://www.gnu.org/licenses/gpl.html |
||
| 12 | */ |
||
| 13 | |||
| 14 | (function( $ ){ |
||
| 15 | var $window = $(window); |
||
| 16 | var windowHeight = $window.height(); |
||
| 17 | |||
| 18 | $window.resize(function () { |
||
| 19 | windowHeight = $window.height(); |
||
| 20 | }); |
||
| 21 | |||
| 22 | $.fn.parallax = function(xpos, speedFactor, outerHeight) { |
||
| 23 | var $this = $(this); |
||
| 24 | var getHeight; |
||
| 25 | var firstTop; |
||
| 26 | var paddingTop = 0; |
||
| 27 | |||
| 28 | //get the starting position of each element to have parallax applied to it |
||
| 29 | $this.each(function(){ |
||
| 30 | firstTop = $this.offset().top; |
||
| 31 | }); |
||
| 32 | |||
| 33 | if (outerHeight) { |
||
| 34 | getHeight = function(jqo) { |
||
| 35 | return jqo.outerHeight(true); |
||
| 36 | }; |
||
| 37 | } else { |
||
| 38 | getHeight = function(jqo) { |
||
| 39 | return jqo.height(); |
||
| 40 | }; |
||
| 41 | } |
||
| 42 | |||
| 43 | // setup defaults if arguments aren't specified |
||
| 44 | if (arguments.length < 1 || xpos === null) xpos = "50%"; |
||
| 45 | if (arguments.length < 2 || speedFactor === null) speedFactor = 0.1; |
||
| 46 | if (arguments.length < 3 || outerHeight === null) outerHeight = true; |
||
| 47 | |||
| 48 | // function to be called whenever the window is scrolled or resized |
||
| 49 | function update(){ |
||
| 50 | var pos = $window.scrollTop(); |
||
| 51 | |||
| 52 | $this.each(function(){ |
||
| 53 | var $element = $(this); |
||
| 54 | var top = $element.offset().top; |
||
| 55 | var height = getHeight($element); |
||
| 56 | |||
| 57 | // Check if totally above or totally below viewport |
||
| 58 | if (top + height < pos || top > pos + windowHeight) { |
||
| 59 | return; |
||
| 60 | } |
||
| 61 | |||
| 62 | $this.css('backgroundPosition', xpos + " " + Math.round((firstTop - pos) * speedFactor) + "px"); |
||
| 63 | }); |
||
| 64 | } |
||
| 65 | |||
| 66 | $window.bind('scroll', update).resize(update); |
||
| 67 | update(); |
||
| 68 | }; |
||
| 69 | })(jQuery); |