Difference between revisions of "Team:UrbanTundra Edmonton/Notebook"

Line 14: Line 14:
 
}
 
}
  
−
body {
+
 
−
  font: normal 16px/1.5 "Helvetica Neue", sans-serif;
+
−
  background: #456990;
+
−
  color: #fff;
+
−
  overflow-x: hidden;
+
−
  padding-bottom: 50px;
+
−
}  /* INTRO SECTION
+
 
–––––––––––––––––––––––––––––––––––––––––––––––––– */
 
–––––––––––––––––––––––––––––––––––––––––––––––––– */
  
Line 35: Line 29:
 
}
 
}
  
−
h1 {
+
 
−
  font-size: 2.5rem;
+
−
}
+
  
  
Line 257: Line 249:
  
 
</div>
 
</div>
 +
 +
<script>
 +
 +
(function() {
 +
 +
  'use strict';
 +
 +
  // define variables
 +
  var items = document.querySelectorAll(".timeline li");
 +
 +
  // check if an element is in viewport
 +
  // http://stackoverflow.com/questions/123999/how-to-tell-if-a-dom-element-is-visible-in-the-current-viewport
 +
  function isElementInViewport(el) {
 +
    var rect = el.getBoundingClientRect();
 +
    return (
 +
      rect.top >= 0 &&
 +
      rect.left >= 0 &&
 +
      rect.bottom <= (window.innerHeight || document.documentElement.clientHeight) &&
 +
      rect.right <= (window.innerWidth || document.documentElement.clientWidth)
 +
    );
 +
  }
 +
 +
  function callbackFunc() {
 +
    for (var i = 0; i < items.length; i++) {
 +
      if (isElementInViewport(items[i])) {
 +
        items[i].classList.add("in-view");
 +
      }
 +
    }
 +
  }
 +
 +
  // listen for events
 +
  window.addEventListener("load", callbackFunc);
 +
  window.addEventListener("resize", callbackFunc);
 +
  window.addEventListener("scroll", callbackFunc);
 +
 +
})();
 +
 +
</script>
 
</html>
 
</html>

Revision as of 04:29, 18 October 2016

URBAN TUNDRA ▤

Vertical Timeline ↓

  • At vero eos et accusamus et iusto odio dignissimos ducimus qui blanditiis praesentium At vero eos et accusamus et iusto odio dignissimos ducimus qui blanditiis praesentium
  • Proin quam velit, efficitur vel neque vitae, rhoncus commodo mi. Suspendisse finibus mauris et bibendum molestie. Aenean ex augue, varius et pulvinar in, pretium non nisi.
  • Proin iaculis, nibh eget efficitur varius, libero tellus porta dolor, at pulvinar tortor ex eget ligula. Integer eu dapibus arcu, sit amet sollicitudin eros.
  • In mattis elit vitae odio posuere, nec maximus massa varius. Suspendisse varius volutpat mattis. Vestibulum id magna est.
  • In mattis elit vitae odio posuere, nec maximus massa varius. Suspendisse varius volutpat mattis. Vestibulum id magna est.
  • In mattis elit vitae odio posuere, nec maximus massa varius. Suspendisse varius volutpat mattis. Vestibulum id magna est.
  • In mattis elit vitae odio posuere, nec maximus massa varius. Suspendisse varius volutpat mattis. Vestibulum id magna est.
  • Aenean condimentum odio a bibendum rhoncus. Ut mauris felis, volutpat eget porta faucibus, euismod quis ante.
  • Vestibulum porttitor lorem sed pharetra dignissim. Nulla maximus, dui a tristique iaculis, quam dolor convallis enim, non dignissim ligula ipsum a turpis.
  • In mattis elit vitae odio posuere, nec maximus massa varius. Suspendisse varius volutpat mattis. Vestibulum id magna est.
  • In mattis elit vitae odio posuere, nec maximus massa varius. Suspendisse varius volutpat mattis. Vestibulum id magna est.
  • In mattis elit vitae odio posuere, nec maximus massa varius. Suspendisse varius volutpat mattis. Vestibulum id magna est.