re-wrote hash scrolling
This commit is contained in:
parent
929cbc3ee0
commit
df3e107605
3 changed files with 21 additions and 4 deletions
|
@ -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');
|
||||
|
|
|
@ -42,6 +42,12 @@ ol , ul{
|
|||
}
|
||||
}
|
||||
|
||||
a.no-color-change {
|
||||
color: inherit;
|
||||
&:hover {
|
||||
color: inherit;
|
||||
}
|
||||
}
|
||||
/* @end Global */
|
||||
|
||||
/* @group Homepage */
|
||||
|
|
|
@ -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">
|
||||
|
|
Reference in a new issue