Просмотр исходного кода

Fix smooth scrolling for Home and Back to Top links

George Cushen 9 лет назад
Родитель
Сommit
1e3879e5a7
3 измененных файлов с 32 добавлено и 14 удалено
  1. 2 4
      exampleSite/config.toml
  2. 1 1
      layouts/partials/header.html
  3. 29 9
      static/js/hugo-academic.js

+ 2 - 4
exampleSite/config.toml

@@ -1,6 +1,4 @@
-# Website URL (e.g. http://www.example.com/)
-baseurl = "/"
-
+baseurl = "http://replace-this-with-your-website-url.com/"
 title = "Academic Theme"
 copyright = "© 2016 Your Name"
 languageCode = "en-us"
@@ -86,7 +84,7 @@ googleAnalytics = ""
 
 [[menu.main]]
     name = "Home"
-    url = "#"
+    url = "#top"
     weight = 1
 
 [[menu.main]]

+ 1 - 1
layouts/partials/header.html

@@ -26,4 +26,4 @@
     <title>{{ if not .IsHome }}{{ .Title }} | {{ end }}{{ .Site.Title }}</title>
 
 </head>
-<body>
+<body id="top">

+ 29 - 9
static/js/hugo-academic.js

@@ -9,11 +9,13 @@
    * Add smooth scrolling to all links inside the main navbar.
    * --------------------------------------------------------------------------- */
 
-  $("#navbar-main li.nav-item a").on('click', function(event){
+  $('#navbar-main li.nav-item a').on('click', function(event){
 
+    // Store requested URL hash.
     var hash = this.hash;
 
-    if( hash && $(hash).length && ($("#homepage").length > 0)) {
+    // If we are on the homepage and the navigation bar link is to a homepage section.
+    if( hash && $(hash).length && ($("#homepage").length > 0)){
       // Prevent default click behavior
       event.preventDefault();
 
@@ -25,18 +27,36 @@
         scrollTop: $(hash).offset().top - navbarHeight
       }, 800, function () {
         // Add hash (#) to URL once finished scrolling to hash position
-        window.location.hash = hash;
+        if (hash == "#top"){
+          window.location.hash = ""
+        }else {
+          window.location.hash = hash;
+        }
       });
     }
   });
 
+  /* ---------------------------------------------------------------------------
+   * Smooth scrolling for Back To Top link.
+   * --------------------------------------------------------------------------- */
+
+  $('#back_to_top').on('click', function(event){
+    event.preventDefault();
+
+    $('html, body').animate({
+      'scrollTop': 0
+    }, 800, function(){
+      window.location.hash = ""
+    });
+  });
+
   /* ---------------------------------------------------------------------------
    * Smooth scrolling for mouse wheel.
    * --------------------------------------------------------------------------- */
 
   function smoothScroll(scrollTime, scrollDistance){
 
-    if (navigator.userAgent.indexOf('Mac') != -1 || navigator.userAgent.indexOf('Firefox') > -1 || jQuery('body').hasClass('is-horizontal')) {
+    if (navigator.userAgent.indexOf('Mac') != -1 || navigator.userAgent.indexOf('Firefox') > -1 || jQuery('body').hasClass('is-horizontal')){
       return;
     }
 
@@ -63,15 +83,15 @@
    * Hide mobile collapsable menu on clicking a link.
    * --------------------------------------------------------------------------- */
 
-  $(document).on('click','.navbar-collapse.in',function(e) {
-    if( $(e.target).is('a') && $(e.target).attr('class') != 'dropdown-toggle' ) {
+  $(document).on('click','.navbar-collapse.in',function(e){
+    if( $(e.target).is('a') && $(e.target).attr('class') != 'dropdown-toggle' ){
       $(this).collapse('hide');
     }
   });
 
-  /* --------------------------------------------------------------------------------------------------------------------------
-   * On Window Load.
-   * ----------------------------------------------------------------------------------------------------------------------- */
+  /* ---------------------------------------------------------------------------
+   * On window load.
+   * --------------------------------------------------------------------------- */
 
   $(window).load(function(){