25 lines
3.5 KiB
JavaScript
25 lines
3.5 KiB
JavaScript
(function($){var $window=$(window),windowHeight=$window.height();$.fn.parallax=function(xposParam){this.each(function(){var $container=$(this),$this=$container.children('.l-section-img'),speedFactor,offsetFactor=0,getHeight,topOffset=0,containerHeight=0,containerWidth=0,disableParallax=!1,parallaxIsDisabled=!1,baseImgHeight=0,baseImgWidth=0,isBgCover=($this.css('background-size')=='cover'),originalBgPos=$this.css('background-position'),curImgHeight=0,reversed=$container.hasClass('parallaxdir_reversed'),baseSpeedFactor=reversed?-0.1:0.61,xpos,outerHeight=!0;if($this.length==0){return}
|
|
if(xposParam===undefined){xpos="50%"}else{xpos=xposParam}
|
|
if($container.hasClass('parallax_xpos_right')){xpos="100%"}else if($container.hasClass('parallax_xpos_left')){xpos="0%"}
|
|
if(outerHeight){getHeight=function(jqo){return jqo.outerHeight(!0)}}else{getHeight=function(jqo){return jqo.height()}}
|
|
function getBackgroundSize(callback){var img=new Image(),width,height,backgroundSize=($this.css('background-size')||' ').split(' '),backgroundWidthAttr=$this.attr('data-img-width'),backgroundHeightAttr=$this.attr('data-img-height');if(backgroundWidthAttr!=''){width=parseInt(backgroundWidthAttr)}
|
|
if(backgroundHeightAttr!=''){height=parseInt(backgroundHeightAttr)}
|
|
if(width!==undefined&&height!==undefined){return callback({width:width,height:height})}
|
|
if(/px/.test(backgroundSize[0])){width=parseInt(backgroundSize[0])}
|
|
if(/%/.test(backgroundSize[0])){width=$this.parent().width()*(parseInt(backgroundSize[0])/100)}
|
|
if(/px/.test(backgroundSize[1])){height=parseInt(backgroundSize[1])}
|
|
if(/%/.test(backgroundSize[1])){height=$this.parent().height()*(parseInt(backgroundSize[0])/100)}
|
|
if(width!==undefined&&height!==undefined){return callback({width:width,height:height})}
|
|
img.onload=function(){if(typeof width=='undefined'){width=this.width}
|
|
if(typeof height=='undefined'){height=this.height}
|
|
callback({width:width,height:height})};img.src=($this.css('background-image')||'').replace(/url\(['"]*(.*?)['"]*\)/g,'$1')}
|
|
function update(){if(disableParallax){if(!parallaxIsDisabled){$this.css('backgroundPosition',originalBgPos);$container.usMod('parallax','fixed');parallaxIsDisabled=!0}
|
|
return}else{if(parallaxIsDisabled){$container.usMod('parallax','ver');parallaxIsDisabled=!1}}
|
|
if(isNaN(speedFactor)){return}
|
|
var pos=$window.scrollTop();if((topOffset+containerHeight<pos)||(pos<topOffset-windowHeight)){return}
|
|
$this.css('backgroundPosition',xpos+" "+(offsetFactor+speedFactor*(topOffset-pos))+"px")}
|
|
function resize(){setTimeout(function(){windowHeight=$window.height();containerHeight=getHeight($this);containerWidth=$this.width();if($window.width()<$us.canvasOptions.disableEffectsWidth){disableParallax=!0}else{disableParallax=!1;if(isBgCover){if(baseImgWidth/baseImgHeight<=containerWidth/containerHeight){curImgHeight=baseImgHeight*($this.width()/baseImgWidth);disableParallax=!1}
|
|
else{disableParallax=!0}}}
|
|
if(curImgHeight!==0){if(baseSpeedFactor>=0){speedFactor=Math.min(baseSpeedFactor,curImgHeight/windowHeight);offsetFactor=Math.min(0,.5*(windowHeight-curImgHeight-speedFactor*(windowHeight-containerHeight)))}else{speedFactor=Math.min(baseSpeedFactor,(windowHeight-containerHeight)/(windowHeight+containerHeight));offsetFactor=Math.max(0,speedFactor*containerHeight)}}else{speedFactor=baseSpeedFactor;offsetFactor=0}
|
|
topOffset=$this.offset().top;update()},10)}
|
|
getBackgroundSize(function(sz){curImgHeight=baseImgHeight=sz.height;baseImgWidth=sz.width;resize()});$window.bind({scroll:update,load:resize,resize:resize});resize()})};jQuery('.parallax_ver').parallax('50%')})(jQuery) |