Difference between revisions of "Template:XJTU-China/Header"

(Undo revision 289231 by LouizQ (talk))
Line 85: Line 85:
 
<script src="https://cdn.bootcss.com/jquery/3.3.1/jquery.min.js"></script>
 
<script src="https://cdn.bootcss.com/jquery/3.3.1/jquery.min.js"></script>
 
<script type='text/javascript' src="https://2018.igem.org/wiki/index.php?title=Template:XJTU-China/jquery.waypoints.min.js&action=raw&ctype=text/javascript"></script>
 
<script type='text/javascript' src="https://2018.igem.org/wiki/index.php?title=Template:XJTU-China/jquery.waypoints.min.js&action=raw&ctype=text/javascript"></script>
<script type='text/javascript' src="https://2018.igem.org/wiki/index.php?title=Template:XJTU-China/home.js&action=raw&ctype=text/javascript"></script>
+
$(document).ready(function(){
<!-- script type="text/javascript" src="home.js"></script -->
+
 
 +
// header scroll to top animation
 +
$(window).scroll(function() {
 +
  if ($(this).scrollTop() == 0) {
 +
    $(function() {
 +
      $('#top-nav .nav-link').clearQueue().animate({lineHeight: '74px'}, 200, 'linear');
 +
      $('.navbar').clearQueue().animate({opacity: '0.75'}, 200, 'linear');
 +
      $('.navbar-header').clearQueue().animate({top: '10px'}, 200, 'linear');
 +
      $('header').data('expend', 'true');
 +
      console.log('scoll to the top');
 +
    });
 +
  } else if ($(this).scrollTop() != 0 && $('header').data('expend') != 'false') {
 +
    $(function() {
 +
      $('.navbar-header').clearQueue().animate({top: '0'}, 400, 'linear');
 +
      $('.navbar').clearQueue().animate({opacity: '1'}, 400, 'linear');
 +
      $('#top-nav .nav-link').clearQueue().animate({lineHeight: '54px'}, 400, 'linear');
 +
      $('header').data('expend', 'false');
 +
    });
 +
  }
 +
});
 +
});
 
</body>
 
</body>
 
</html>
 
</html>

Revision as of 06:23, 14 October 2018

$(document).ready(function(){ // header scroll to top animation $(window).scroll(function() { if ($(this).scrollTop() == 0) { $(function() { $('#top-nav .nav-link').clearQueue().animate({lineHeight: '74px'}, 200, 'linear'); $('.navbar').clearQueue().animate({opacity: '0.75'}, 200, 'linear'); $('.navbar-header').clearQueue().animate({top: '10px'}, 200, 'linear'); $('header').data('expend', 'true'); console.log('scoll to the top'); }); } else if ($(this).scrollTop() != 0 && $('header').data('expend') != 'false') { $(function() { $('.navbar-header').clearQueue().animate({top: '0'}, 400, 'linear'); $('.navbar').clearQueue().animate({opacity: '1'}, 400, 'linear'); $('#top-nav .nav-link').clearQueue().animate({lineHeight: '54px'}, 400, 'linear'); $('header').data('expend', 'false'); }); } }); });