Team:UT-Dallas

From 2014.igem.org

(Difference between revisions)
Line 37: Line 37:
<div id="parallax3" class="spacer s5" style="background-image: url(https://static.igem.org/mediawiki/2014/b/b8/Team.jpg);"></div>
<div id="parallax3" class="spacer s5" style="background-image: url(https://static.igem.org/mediawiki/2014/b/b8/Team.jpg);"></div>
<div class="spacer s2"></div>
<div class="spacer s2"></div>
-
<script>
+
<script src="https://2014.igem.org/Team:UT-Dallas/general.js?action=raw&ctype=text/javascript"></script>
-
$(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: 20,
+
-
marginLeft: -500
+
-
});
+
-
} else if (scrollY < bodyY && isfixed) {
+
-
$floatingbox.css({
+
-
position: 'relative',
+
-
left: 0,
+
-
top: 0,
+
-
marginLeft: originalX
+
-
});
+
-
}
+
-
}
+
-
});
+
-
}
+
-
});
+
-
</script>
+
</section>
</section>
</div>
</div>
</html>
</html>

Revision as of 19:48, 17 October 2014

Content 1

view source

Content 2

view source

Retrieved from "http://2014.igem.org/Team:UT-Dallas"