feat(back-to-top): update back-to-top IXD

layout/_partial/footer_top.ejs

@@ -1,4 +1,4 @@
-<div class="toTop-wrap">
+<div id="back-to-top" class="toTop-wrap">
     <a href="#top" class="toTop">
         <i class="material-icons footer_top-i">expand_less</i>
     </a>

source/css/style.css

@@ -2425,16 +2425,31 @@ a {
 /* Footer_Top */
 /**************/
 
-.toTop-wrap {
+#back-to-top{
+    display: block;
+    position: fixed;
+    bottom: 24px;
+    right: -41px;
+    transition: background-color .18s cubic-bezier(.6,0,.1,1),box-shadow .18s cubic-bezier(.6,0,.1,1),transform .18s cubic-bezier(.6,0,.1,1);
+    z-index: 8;
+}
+#back-to-top.btt-visible{
+    transform: translate(-64px, 0);
+}
+#back-to-top.btt-docked{
     position: absolute;
     bottom: 100px;
-    right: 34.61px;
-    z-index: 8
 }
 @media screen and (max-width: 840px) {
-    .toTop-wrap {
+    #back-to-top{
+        bottom: 24px;
+    }
+    #back-to-top.btt-visible{
+        transform: translate(-60px, 0);
+    }
+    #back-to-top.btt-docked{
+        position: absolute;
         bottom: 180px;
-        right: 28px
     }
 }
 .toTop {

source/js/js.js

@@ -2,7 +2,7 @@
 /*global $, jQuery, alert*/
 
 // Custom_js
-// Active_Toc_js
+// Back_to_top_js
 // Material_js
 // Bootstrap_js
 // Sidebar_js
@@ -92,10 +92,26 @@ $(document).ready(function() {
 
 //**********************************
 //**********************************
-//**********************************   Active_Toc_js
+//**********************************   Back_to_top_js
 //**********************************
 //**********************************
 
+$(window).scroll(function (event) {
+    var scroll = $(window).scrollTop();
+	if (scroll > 300) {
+		$('#back-to-top').addClass('btt-visible');
+	} else {
+		$('#back-to-top').removeClass('btt-visible');
+	}
+
+	var footerOffset = $('.mdl-mini-footer').offset().top;
+	var windowHeight = $( window ).height();
+	if (scroll > footerOffset - windowHeight + 42) {
+		$('#back-to-top').addClass('btt-docked');
+	} else {
+		$('#back-to-top').removeClass('btt-docked');
+	}
+});
 
 //**********************************
 //**********************************