Run jQuery event only once after a condition matches

Question

I am making online product site, I am trigging a scroll event, at starting only 12 elements will be shown but when 8th element is scrolled to top scroll event should run onl

Answer 1

Use on() and off(), and unbind the event handler when the scrolling reaches the right point :

var navigation_offset_top = $('.prods-list li:nth-child(4)').offset().top;  

$(window).on("scroll", doScroll);

function doScroll() {
    var scroll_top = $(window).scrollTop();
    if (scroll_top > sticky_navigation_offset_top) { 
        console.log("Hi");
        $(window).off('scroll', doScroll);
    }
};