Make sure to add the class stickyButton to the button:
Apply STICKY to the section where the button is:
And add the class hideTrigger to the section where you want the button to disappear:
Finally add this code in CUSTOM CODES> HEAD HTML:
<script>
document.addEventListener('DOMContentLoaded', () => {
const buttons = document.querySelectorAll('.stickyButton');
const targets = document.querySelectorAll('.hideTrigger');
if (!targets.length) {
console.error("No elements with class 'hideTrigger' found.");
return;
}
const observer = new IntersectionObserver((entries) => {
entries.forEach(entry => {
buttons.forEach(button => {
button.style.display = entry.isIntersecting ? 'none' : 'block';
});
});
}, {
root: null,
threshold: 0.1
});
targets.forEach(target => observer.observe(target));
});
</script>
Please remember to have your custom domain connected for the codes to work.