[Support request] Scroll back to top button only when swipe down

Home Forums Support [Support request] Scroll back to top button only when swipe down

Home Forums Support Scroll back to top button only when swipe down

Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • #1546533
    jose

    How can I show ‘Scroll back to top button’ only when I swipe down in mobile or scroll down in browser.

    #1547012
    Elvin
    Staff
    Customer Support

    Hi,

    This is the default behavior of the back to top button GeneratePress adds when you enable it from Appearance > Customize > Layout > Footer.

    Does it behave differently on your site? Can you link us to the site in question? Thank you.

    A wise man once said:
    "Have you cleared your cache?"

    #1547031
    jose

    If you are on the bottom of the page and swipe up, the ‘Scroll back to top button’ is stil there.

    So I want to show the ‘Scroll back to top button’ only If I swipe down, no when I swipe up.

    #1547093
    Elvin
    Staff
    Customer Support

    Ah right.

    You can try this script:

    <script>
    	var backToTop = document.querySelector("a.generate-back-to-top");
    	// Initial state
    	var scrollPos = 0;
    	// adding scroll event
    	window.addEventListener('scroll', function(){
    	  // detects new state and compares it with the new one
    	  if ((document.body.getBoundingClientRect()).top > scrollPos) {
    			
    			backToTop.style.display = "none";
    		console.log('swipe down');
    		} else{
    			backToTop.style.display = "block";
    		console.log('swipe up');
    			}
    		// saves the new position for iteration.
    		scrollPos = (document.body.getBoundingClientRect()).top;
    	});
    </script>

    Add this on a Hook Element. Set the hook to wp_footer and set the Display rule location to “Entire Site”.

    A wise man once said:
    "Have you cleared your cache?"

Viewing 4 posts - 1 through 4 (of 4 total)
  • You must be logged in to reply to this topic.