CMS Development

Janette
Participant

How can I make a button disappear when scrolling my landing page

SOLVE

Hi Good Morning

 

I would like to know how can I make to desappear a button like this (I atthached a screenshot ) when scrolling in my page and when I return appear again?

 

I remain to your comments.

Regards cta down.PNG

 

 

0 Upvotes
1 Accepted solution
Stephanie-OG
Solution
Key Advisor

How can I make a button disappear when scrolling my landing page

SOLVE

Hi Janette.

 

You can use JavaScript or jQuery to show or hide an element. For example, if you have an "arrow" class, you can use jQuery's scroll(), fadeIn() and fadeOut() functions like this:

 

$(window).scroll(function() {
    if ($(this).scrollTop()> 20) {
        $('.arrow').fadeOut();
     }
    else {
      $('.arrow').fadeIn();
     }
 });

 

Here's an example of how this works. 


Stephanie O'Gay Garcia
HubSpot Design / Development / Automation
Website | Contact

View solution in original post

0 Upvotes
3 Replies 3
Stephanie-OG
Solution
Key Advisor

How can I make a button disappear when scrolling my landing page

SOLVE

Hi Janette.

 

You can use JavaScript or jQuery to show or hide an element. For example, if you have an "arrow" class, you can use jQuery's scroll(), fadeIn() and fadeOut() functions like this:

 

$(window).scroll(function() {
    if ($(this).scrollTop()> 20) {
        $('.arrow').fadeOut();
     }
    else {
      $('.arrow').fadeIn();
     }
 });

 

Here's an example of how this works. 


Stephanie O'Gay Garcia
HubSpot Design / Development / Automation
Website | Contact

0 Upvotes
Janette
Participant

How can I make a button disappear when scrolling my landing page

SOLVE

Thanks for the information I´m going to try with this solution.

 

Regards

 

0 Upvotes
Janette
Participant

How can I make a button disappear when scrolling my landing page

SOLVE
0 Upvotes