Jump to content
Search In
  • More options...
Find results that contain...
Find results in...
Advanced Search
  • 1

Getting "Back to Top" button to work


PJIFD

Question

Hi everybody,

Hope you're well.

I have a question regarding my attempt to get a "Back to top" button. I have followed all the advice listed from the top rated post (HammaadM) here:

https://forum.squarespace.com/topic/10886-how-can-i-add-a-scroll-to-top-button/

This means A) I have added a code block in my footer with code: 

<a href="#" class="scrollup">Scroll</a>

B) I have added to custom CSS the following code (the URL is the Back to Top button I'd like to use): 

.scrollup {
 width: 40px;
 height: 40px;
 opacity: 0.3;
 position: fixed;
 bottom: 50px;
 right: 100px;
 display: none;
 text-indent: -9999px;
 background: url('https://i.ibb.co/m6SvsMy/Back-to-top-icon.png') no-repeat;
}

C) I have added to the Header the following JS:

<script src="//ajax.googleapis.com/ajax/libs/jquery/2.0.2/jquery.min.js"></script>
<script>
 $(document).ready(function () {
     $(window).scroll(function () {
         if ($(this).scrollTop() > 100) {
             $('.scrollup').fadeIn();
         } else {
             $('.scrollup').fadeOut();
         }
     });
     $('.scrollup').click(function () {
         $("html, body").animate({
             scrollTop: 0
         }, 600);
         return false;
     });
 });
</script>

 

However, I'm not seeing the Back to Top button working at all on my site (which is currently Private and in Preview mode). I wondered if anyone had experienced similar or had any ideas why this isn't working? I can't see anything at the moment - nothing in the Footer, and certainly no image that appears as the site is being scrolled which is what I was hoping to achieve.

 

Thanks very much in advance for any help you can provide. 

Link to post
  • Answers 1
  • Created
  • Last Reply

Top Posters For This Question

Top Posters For This Question

Popular Posts

Hi everybody, Hope you're well. I have a question regarding my attempt to get a "Back to top" button. I have followed all the advice listed from the top rated post (HammaadM) here: http

1 answer to this question

Recommended Posts

  • 0
On 11/17/2020 at 11:56 PM, PJIFD said:

Hi everybody,

Hope you're well.

I have a question regarding my attempt to get a "Back to top" button. I have followed all the advice listed from the top rated post (HammaadM) here:

https://forum.squarespace.com/topic/10886-how-can-i-add-a-scroll-to-top-button/

This means A) I have added a code block in my footer with code: 


<a href="#" class="scrollup">Scroll</a>

B) I have added to custom CSS the following code (the URL is the Back to Top button I'd like to use): 


.scrollup {
 width: 40px;
 height: 40px;
 opacity: 0.3;
 position: fixed;
 bottom: 50px;
 right: 100px;
 display: none;
 text-indent: -9999px;
 background: url('https://i.ibb.co/m6SvsMy/Back-to-top-icon.png') no-repeat;
}

C) I have added to the Header the following JS:


<script src="//ajax.googleapis.com/ajax/libs/jquery/2.0.2/jquery.min.js"></script>
<script>
 $(document).ready(function () {
     $(window).scroll(function () {
         if ($(this).scrollTop() > 100) {
             $('.scrollup').fadeIn();
         } else {
             $('.scrollup').fadeOut();
         }
     });
     $('.scrollup').click(function () {
         $("html, body").animate({
             scrollTop: 0
         }, 600);
         return false;
     });
 });
</script>

 

However, I'm not seeing the Back to Top button working at all on my site (which is currently Private and in Preview mode). I wondered if anyone had experienced similar or had any ideas why this isn't working? I can't see anything at the moment - nothing in the Footer, and certainly no image that appears as the site is being scrolled which is what I was hoping to achieve.

 

Thanks very much in advance for any help you can provide. 

You can set up a Site-wide passwords – Squarespace Help so we can look into your site issue and get it sorted real quick

Greeting, it's BaNgan from BeyondSpace, I am Squarespace dev focus on provide solutions to enhance feature that squarespace.com can't provide.
Feel free to check my current Squarespace Plugins Developement, Enable Pinch/Zoom on lightboxGeolocation Automatic Currency Converter, Sortable Table from GSheet
If you find my answer fit your need, let's leave a like or upvote so others with the same issue can find their solution. Thank you

Link to post

Create an account or sign in to comment

You need to be a member in order to leave a comment


×
×
  • Create New...