Added scroll to top in footer (publiclab#2251)

Souravirus · Mar 12, 2018 · 4f6051f · 4f6051f
1 parent 55019b0
commit 4f6051f
Show file tree

Hide file tree

Showing 4 changed files with 29 additions and 0 deletions.
diff --git a/app/assets/javascripts/application.js b/app/assets/javascripts/application.js
@@ -50,4 +50,5 @@
 //= require chart.js/dist/Chart.js
 //  require turbolinks // Temporarily removed while fixing
 //= require google_analytics.js
+//= require header_footer.js
 
diff --git a/app/assets/javascripts/header_footer.js b/app/assets/javascripts/header_footer.js
@@ -0,0 +1,11 @@
+jQuery(document).ready(function() {	 
+	var duration = 300;
+
+	$(".back-to-top").click(function(event) {
+		event.preventDefault();
+		jQuery("html, body").animate({scrollTop: 0}, duration);		 
+		return false;
+	})
+
+});
+
diff --git a/app/assets/stylesheets/style.css b/app/assets/stylesheets/style.css
@@ -417,3 +417,15 @@ div.note.moderated h4 {
     font-size: 80%;
   }
 }
+
+.back-to-top {
+
+  float: right;
+
+}
+
+.back-to-top i {
+
+  font-size: 60px;
+
+}
diff --git a/app/views/layouts/_footer.html.erb b/app/views/layouts/_footer.html.erb
@@ -39,6 +39,11 @@
         <% end %>
       </ul>
     </ul>
+
+    <a href="#" class="back-to-top" style="display: inline;">
+      <i class="fa fa-arrow-circle-up"></i>
+    </a>
+
   </div>
   <br style="clear:both;" />
 </footer>