1
Fork 0

re-wrote hash scrolling

This commit is contained in:
Jake Howard 2015-11-11 16:32:51 +00:00
parent 929cbc3ee0
commit df3e107605
3 changed files with 21 additions and 4 deletions

View file

@ -1,9 +1,20 @@
var React = require('react');
var ProjectImages = require('./components/project-images');
window.scrollToElement = function(ident) {
$('html, body').animate({scrollTop: $(ident).offset().top}, 1000);
}
$(function() { // https://css-tricks.com/snippets/jquery/smooth-scrolling/
$('a[href*=#]:not([href=#])').click(function() {
if (location.pathname.replace(/^\//,'') == this.pathname.replace(/^\//,'') && location.hostname == this.hostname) {
var target = $(this.hash);
target = target.length ? target : $('[name=' + this.hash.slice(1) +']');
if (target.length) {
$('html,body').animate({
scrollTop: target.offset().top
}, 1000);
return false;
}
}
});
});
$(window).load(function(){
$(window).trigger('scroll').trigger('resize');

View file

@ -42,6 +42,12 @@ ol , ul{
}
}
a.no-color-change {
color: inherit;
&:hover {
color: inherit;
}
}
/* @end Global */
/* @group Homepage */

View file

@ -8,7 +8,7 @@
<img src="http://placehold.it/230x230"/>
<h1>Hello, world!</h1>
<p>Some random subtitle</p>
<p><i onClick="scrollToElement('#intro-text')" class="icon ion-chevron-down"></i></p>
<p><a href="#intro-text" class="no-color-change"><i class="icon ion-chevron-down"></i></a></p>
</div>
</div>
<div class="container-fluid" id="intro-text">