How to add delay in fixed button that I created using Hook?

Hi there,

can you link me to the page where i can see the button?

Hey David, I replied to you in the private information.

First you would need this CSS, which will hide the button until the show class is added:

.sticky-button {
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.3s ease-in;
}
.sticky-button.show {
    opacity: 1;
    pointer-events: initial;
}

Then you will need this Javascript, which needs to be hooked in after the Button. You can include it below your buttons HTML:

<script>
setTimeout(() => document.querySelector('.sticky-button').classList.add('show'), 5000);
</script>

After 5000ms ( 5 seconds ) the show class gets added to the element.

Thank you, David.
It is perfect now. How can I adjust the padding around the fixed button as you can see that it is coming out of the sticky button?

Hi,

You can use this CSS to control the padding.

a.button.sticky-button.thirstylinkimg.show {
padding: 0;
line-height: 0;
}

line-height is added to remove the space not caused by padding and margin. You can adjust the padding value to your preference.

Okay, thank you.

Okay, thank you.

No problem. :)