Team:Cornell/sandbox

From 2013.igem.org

(Difference between revisions)
Line 315: Line 315:
.section .inner {  
.section .inner {  
background-image: url("https://static.igem.org/mediawiki/igem.org/6/67/IGEMsmall.png");
background-image: url("https://static.igem.org/mediawiki/igem.org/6/67/IGEMsmall.png");
 +
height: 100px;
 +
background-repeat: no-repeat;
 +
}
 +
 +
.constant {
height: 100px;
height: 100px;
}
}
Line 320: Line 325:
<script type="text/javascript">
<script type="text/javascript">
jQuery(document).ready(function($) {
jQuery(document).ready(function($) {
 +
//initial values for inner
 +
a = parseFloat(400);
 +
c = parseFloat(400);
 +
 +
//in values for section
 +
b = parseFloat(0);
 +
d = parseFloat(0);
 +
 +
var scrollTop = $(window).scrollTop();
 +
var scroll-actually = new Array(); //identifies x/y values for background
 +
 +
$(window).scroll(function() {
 +
//scroll up
 +
if(scrollTop > $(this).scrollTop()) {
 +
//first background
 +
if(getScrollTop() <= 1600 && getScrollTop() >=0) {
 +
a = a + 35;
 +
b = b + 10;
 +
 +
$('.1s').css('backgroundPosition', '50% '+a+'px');
 +
$('.1i').css('backgroundPosition', '0 '+b+'px');
 +
}
 +
//second background
 +
if(getScrollTop() >= 2050 && getScrollTop() <= 3650) {
 +
c = c + 35;
 +
d = d + 10;
 +
 +
$('.2s').css('backgroundPosition', '50% '+c+'px');
 +
$('.2i').css('backgroundPosition', '0 '+d+'px');
 +
}
 +
}
 +
//scroll down
 +
else {
 +
//first background
 +
if(getScrollTop() <= 1600 && getScrollTop() >=0) {
 +
a = a - 35;
 +
b = b - 10;
 +
 +
$('.1s').css('backgroundPosition', '50% '+a+'px');
 +
$('.1i').css('backgroundPosition', '0 '+b+'px');
 +
}
 +
//second background
 +
if(getScrollTop() >= 2050 && getScrollTop() <= 3650) {
 +
c = c - 35;
 +
d = d - 10;
 +
 +
$('.2s').css('backgroundPosition', '50% '+c+'px');
 +
$('.2i').css('backgroundPosition', '0 '+d+'px');
 +
}
 +
}
 +
 +
//resets to 0
 +
if (getScrollTop() == 0) {
 +
a = parseFloat(400);
 +
c = parseFloat(400);
 +
b = parseFloat(0);
 +
d = parseFloat(0);
 +
 +
$('.1s').css('backgroundPosition', '0 0');
 +
$('.1i').css('backgroundPosition', '0 0');
 +
$('.2s').css('backgroundPosition', '50% '+400+'px');
 +
$('.2i').css('backgroundPosition', '50% '+400+'px');
 +
}
 +
}
 +
}
</script>
</script>
</head>
</head>
Line 326: Line 396:
<div class="content">
<div class="content">
<h1> Whee </h1>
<h1> Whee </h1>
-
<div class="section">
+
<div class="section 1s">
-
<div class="inner">
+
<div class="inner 1i">
</div>
</div>
Line 333: Line 403:
<div class="constant">
<div class="constant">
</div>
</div>
-
<div class="section">
+
<div class="section 2s">
-
<div class="inner">
+
<div class="inner 2i">
</div>
</div>

Revision as of 16:22, 26 December 2013

Parallax Test

Whee

Retrieved from "http://2013.igem.org/Team:Cornell/sandbox"