Difference between revisions of "Team:William and Mary/RealMainPage"

Line 7: Line 7:
  
 
<script>
 
<script>
−
$('a[href^="#"]').on('click', function(event) {
+
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
 +
<script>
 +
$(document).ready(function(){
 +
  // Add smooth scrolling to all links
 +
  $("a").on('click', function(event) {
  
−
     var target = $(this.getAttribute('href'));
+
     // Make sure this.hash has a value before overriding default behavior
 +
    if (this.hash !== "") {
 +
      // Prevent default anchor click behavior
 +
      event.preventDefault();
  
−
    if( target.length ) {
+
      // Store hash
−
        event.preventDefault();
+
      var hash = this.hash;
−
        $('html, body').stop().animate({
+
−
            scrollTop: target.offset().top
+
−
        }, 1000);
+
−
    }
+
  
 +
      // Using jQuery's animate() method to add smooth page scroll
 +
      // The optional number (800) specifies the number of milliseconds it takes to scroll to the specified area
 +
      $('html, body').animate({
 +
        scrollTop: $(hash).offset().top
 +
      }, 800, function(){
 +
 
 +
        // Add hash (#) to URL when done scrolling (default click behavior)
 +
        window.location.hash = hash;
 +
      });
 +
    } // End if
 +
  });
 
});
 
});
−
 
 
−
 
 
</script>
 
</script>
  
Line 57: Line 69:
  
  
−
<a href="#bottom" id="top"><img src="https://static.igem.org/mediawiki/2017/8/8c/T--William_and_Mary--arrowright.jpeg" height = "80"/></a>
+
<a href="#section2"><img src="https://static.igem.org/mediawiki/2017/8/8c/T--William_and_Mary--arrowright.jpeg" height = "80"/></a>
  
  
 +
<div class="main">
 +
  <section></section>
 +
</div>
  
  
Line 72: Line 87:
 
</div>
 
</div>
  
−
<div>
+
 
−
<img src="https://static.igem.org/mediawiki/2017/e/eb/T--William_and_Mary--arrowleft.jpeg" height = "80"/>
+
−
</div>
+
  
 
<br>
 
<br>
 
<br/>
 
<br/>
  
 +
 +
 +
<div class="main" id="section2">
 
<center>
 
<center>
−
<a href="#top" id="bottom"><img src="https://static.igem.org/mediawiki/2017/d/de/T--William_and_Mary--greenyellowinfographic.jpeg" height = "2200"/></a>
+
<section><img src="https://static.igem.org/mediawiki/2017/d/de/T--William_and_Mary--greenyellowinfographic.jpeg" height = "2200"/></section>
 
</center>
 
</center>
 
</div>
 
</div>
 +
 +
  
  

Revision as of 02:38, 5 October 2017



For more information, click here .