Difference between revisions of "Team:CCU Taiwan"

Line 170: Line 170:
 
</div>
 
</div>
 
</div>
 
</div>
 +
</div>
 +
 +
<div class="pagecontainer">
 +
  <section class="small">
 +
    <div class="box reveal"><img src="https://static.igem.org/mediawiki/2018/b/b8/T--CCU_Taiwan--CCUABbB2.jpg" width="100%" hieght="100%"></div>
 +
    <div class="box reveal"></div>
 +
    <div class="box reveal"></div>
 +
    <div class="box reveal"></div>
 +
  </section>
 
</div>
 
</div>
  
Line 205: Line 214:
 
     popup.classList.toggle("show");
 
     popup.classList.toggle("show");
 
}
 
}
 +
 +
var rafId = null;
 +
var delay = 400;
 +
var lTime = 0;
 +
 +
function scroll() {
 +
  var scrollTop = $(window).scrollTop();
 +
  var height = $(window).height()
 +
  var visibleTop = scrollTop + height;
 +
  $('.reveal').each(function() {
 +
    var $t = $(this);
 +
    if ($t.hasClass('reveal_visible')) { return; }
 +
    var top = $t.offset().top;
 +
    if (top <= visibleTop) {
 +
      if (top + $t.height() < scrollTop) {
 +
        $t.removeClass('reveal_pending').addClass('reveal_visible');
 +
      } else {
 +
        $t.addClass('reveal_pending');
 +
        if (!rafId) requestAnimationFrame(reveal); 
 +
      }
 +
    }
 +
  });
 +
}
 +
function reveal() {
 +
  rafId = null;
 +
  var now = performance.now();
 +
 
 +
  if (now - lTime > delay) {
 +
    lTime = now;
 +
    var $ts = $('.reveal_pending');
 +
    $($ts.get(0)).removeClass('reveal_pending').addClass('reveal_visible'); 
 +
  }
 +
 
 +
 
 +
  if ($('.reveal_pending').length >= 1) rafId = requestAnimationFrame(reveal);
 +
}
 +
 +
$(scroll);
 +
$(window).scroll(scroll);
 +
$(window).click(function() {
 +
  $('.reveal').removeClass('reveal_visible').removeClass('reveal_pending');
 +
  lTime = performance.now() + 500;
 +
  var top = $(window).scrollTop();
 +
  $(window).scrollTop(top === 0 ? 1 : top-1);
 +
});
 +
 +
  
  

Revision as of 22:29, 17 October 2018