How To Make An On Scroll Sticky Effect in Free Elementor

1. Giving an ID

Give an ID of “sticky-effect” to the container you want to stick on scrolling as shown in the figure.

2. Adding an HTML Code Element

1. Create a new container.
2. After that add an HTML Code element to it.
3. Paste the below code in the Code Block

<style>
    .sticky{
        position: fixed;
        top: 0;
        width: 100%;
        display: flex;
    }
</style>
<script>
    window.onscroll = function() {myFunction()};
    var header = document.getElementById("sticky-effect");
    var sticky = header.offsetTop;
    function myFunction() {
        if (window.pageYOffset > sticky) {
            header.classList.add("sticky");
        } else {
            header.classList.remove("sticky");
        }
    }
</script>