Running function on window scroll once in jQuery

Question

I\'m creating my portfolio and I\'m trying to make my skill bars load when I go to \"My skills\" section. I want them to do it only once, either when someone scroll to this sect

Answer 1

You can set a namespace at .on() for resize, scroll events, use .off() within if statement to remove namespaced events.

var skills = $('#mySkills');
var skillsPositionTop = skills.position().top;
$(window).on("resize.once scroll.once", function (){
  if (pageYOffset<skillsPositionTop-20 && pageYOffset>skillsPositionTop-80) {
    $(this).off("resize.once").off("scroll.once");
    console.log ("here is my loading script");
  }
});