Smooth Scrolling

This commit is contained in:
aggelosQQ 2016-12-30 11:25:23 +02:00
parent f98b19fd9d
commit 2612a0c27d
2 changed files with 30 additions and 7 deletions

View file

@ -21,11 +21,11 @@
<div class="navbar-fixed">
<nav class="transparent z-depth-0" id="menu">
<div class="nav-wrapper z-depth-0">
<a href="#header" class="brand-logo"></a> <a href="#" data-activates="mobile" class="button-collapse"><i class="fa fa-bars"></i></a>
<a href="#" id="brand-top" class="brand-logo"></a> <a href="#" data-activates="mobile" class="button-collapse"><i class="fa fa-bars"></i></a>
<ul class="right hide-on-med-and-down cl-effect-14" id="cl-effect-14">
<li><a href="#header">Home</a></li>
<li><a href="#rules">Rules</a></li>
<li><a href="#staff">Staff</a></li>
<li><a href="#" id="top">Home</a></li>
<li><a href="#" id="rules">Rules</a></li>
<li><a href="#" id="staff">Staff</a></li>
<li><a href="masterbuilders/">Masterbuilders</a></li>
<li><a href="http://totalfreedom.boards.net" class="tooltipped" data-position="bottom" data-delay="50" data-tooltip="You will be redirected to totalfreedom.boards.net">Forum</a></li>
</ul>
@ -54,7 +54,7 @@
<div class="modal-footer"> <a href="#!" class=" modal-action modal-close btn-flat waves-effect waves-dark">Close</a> </div>
</div>
</div>
<div class="section cover-2" id="rules">
<div class="section cover-2" id="rules-sec">
<h1 class="section-title">TotalFreedom Rules</h1>
<div class="rules-section">
<h2 id="rules-title" class="one waves-effect waves-brown">No Griefing <i class="fa fa-chevron-right rules-icon hide-on-med-and-down"></i></h2>
@ -106,7 +106,7 @@
</div>
</div>
</div>
<div class="section cover-3" id="staff">
<div class="section cover-3" id="staff-sec">
<br/>
<h1 class="section-title">Current Staff</h1>
<div class="admins">

View file

@ -112,3 +112,26 @@ $(document).ready(function(){
$(".nine i").toggleClass("fa-chevron-down");
});
});
$(document).ready(function() {
$("#top").click(function() {
$('html, body').animate({
scrollTop: $("html, body").offset().top
}, 1000);
});
$("#rules").click(function() {
$('html, body').animate({
scrollTop: $("#rules-sec").offset().top
}, 1000);
});
$("#staff").click(function() {
$('html, body').animate({
scrollTop: $("#staff-sec").offset().top
}, 1000);
});
$("#brand-top").click(function() {
$('html, body').animate({
scrollTop: $("html, body").offset().top
}, 1000);
});
});