Problem with the scroll button on mobile

[CreatorTim]

Hi, I added a scroll button to my store, which takes you to the top of the page when clicked. However, on mobile, if I scroll halfway down the store and then click on the header, the button remains visible.

How can I make it disappear when I click on the header? Basically, I want the button to be active only on the main pages. If I click on the header, it should vanish, but when I navigate back, it should reappear.

Here’s my store: https://1049xn-ya.myshopify.com/

As I mentioned, this is for mobile

Thanks a lot,
Tim

[DaisyVo]

Hi @CreatorTim ,

You can follow the steps here:

Step 1: Shopify admin > Online store > Customize: https://prnt.sc/XQ6IDB99kUCd
Step 2: From the left menu > Theme settings > Open Custom CSS: https://prnt.sc/ypQ7nly2wv27
Step 3: Copy the code below and paste it there

Here is the code for step 3:

@media screen and (max-width: 768px){
body div#scrollToTop {
    z-index: 2 !important;
}
}

Here is the result:

Please let me know if it works!

Best,

Daisy

[CreatorTim]

Works thank you