fixed scrolling

Script to stick HTML element to the top when scrolled through

jQuery div fixed position of div when scrolling.

The HTML Code:
<div id="stick-here"></div>
<div id="stickThis">Sticky note</div>

JavaScript Code:
function sticktothetop() {
    var window_top = $(window).scrollTop();
    //alert(window_top);
    var top = $('#stick-here').offset().top;
    if (window_top > top) {
        $('#stickThis').addClass('stick');
    } else {
        $('#stickThis').removeClass('stick');
    }
}
$(function() {
    $(window).scroll(sticktothetop);
    sticktothetop();
});

CSS Code:
#stickThis.stick {
    margin-top: 0;
    position: fixed;
    top: 0;
    z-index: 9999;
}

jQuery Reference file  URL-
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>

Live example as,

OR

You can use jQuery to do it:

jQuery(document).ready(function (){
    $(window).scroll(function() {
        if ($(this).scrollTop() === 100) { // this refers to window
            $('.ad-container').css('position', 'fixed');
        } else {
            $('.ad-container').css('position', 'static');
       }
    });
});
ANIL SINGH

Anil Singh is an author, tech blogger, and software programmer. Book writing, tech blogging is something do extra and Anil love doing it. For more detail, kindly refer to this link..
My Blogs - https://code-sample.com and https://code-sample.xyz
My Book1 - BEST SELLING ANGULAR BOOK (INCLUDING ALL VERSIONS 2, 4, 5, 6, 7)
My Book2 - ANGULAR 2 INTERVIEW QUESTIONS BOOK - Both Books are Available on WorldWide.

www.code-sample.com/. Powered by Blogger.
^