"
Team:UT-Dallas/general.js
From 2014.igem.org
(Created page with " $(document).ready(function($) { // define params var duration = $("#parallax1").height() + $(window).height(); var bgPosMovement = "0 " + (duration*0.8...") |
|||
| Line 1: | Line 1: | ||
| + | $j(document).ready(function($) { | ||
| + | |||
$(document).ready(function($) { | $(document).ready(function($) { | ||
// define params | // define params | ||
| Line 37: | Line 39: | ||
position: 'fixed', | position: 'fixed', | ||
left: '50%', | left: '50%', | ||
| - | top: | + | top: '-10px' |
| - | + | ||
}); | }); | ||
} else if (scrollY < bodyY && isfixed) { | } else if (scrollY < bodyY && isfixed) { | ||
$floatingbox.css({ | $floatingbox.css({ | ||
position: 'relative', | position: 'relative', | ||
| - | left: 0, | + | left: '0', |
| - | top: | + | top: '-10px' |
| - | + | ||
}); | }); | ||
} | } | ||
| Line 52: | Line 52: | ||
} | } | ||
}); | }); | ||
| + | }); | ||
Revision as of 19:06, 17 October 2014
$j(document).ready(function($) {
$(document).ready(function($) { // define params var duration = $("#parallax1").height() + $(window).height(); var bgPosMovement = "0 " + (duration*0.8) + "px";
// init controller var controller = new ScrollMagic({globalSceneOptions: {triggerHook: "onEnter", duration: duration}});
// build scenes new ScrollScene({triggerElement: "#trigger1"}) .setTween(TweenMax.to("#parallax1", 1, {backgroundPosition: bgPosMovement, ease: Linear.easeNone})) .addTo(controller);
new ScrollScene({triggerElement: "#trigger2"}) .setTween(TweenMax.to("#parallax2", 1, {backgroundPosition: bgPosMovement, ease: Linear.easeNone})) .addTo(controller);
new ScrollScene({triggerElement: "#trigger3"}) .setTween(TweenMax.to("#parallax3", 1, {backgroundPosition: bgPosMovement, ease: Linear.easeNone})) .addTo(controller);
//this is the floating content var $floatingbox = $('#top_bar');
if ($('#content_body').length > 0) {
var bodyY = parseInt($('#content_body').offset().top) - 20; var originalX = $floatingbox.css('margin-left'); $(window).scroll(function() { var scrollY = $(window).scrollTop(); var isfixed = $floatingbox.css('position') == 'fixed'; if ($floatingbox.length > 0) { $floatingbox.html("srollY : " + scrollY + ", bodyY : " + bodyY + ", isfixed : " + isfixed); if (scrollY > bodyY && !isfixed) { $floatingbox.stop().css({ position: 'fixed', left: '50%', top: '-10px' }); } else if (scrollY < bodyY && isfixed) { $floatingbox.css({ position: 'relative', left: '0', top: '-10px' }); } } }); } });
});
