Skip to content Skip to sidebar Skip to footer

How To Execute A Js Function When The User Reaches A Specific Element In The Page?

How can I automatically execute a JavaScript function when the user reaches a specific position on the page? When I scroll down to the bottom of the page, an AJAX-call shall be exe

Solution 1:

Fixed for default JavaScript: http://cdpn.io/xdjmG

HTML:

<div id="page" style="min-height: 10000px;">
    <div id="anotherElement" style="margin-top: 500px; min-height: 500px; background-color:red"></div>
</div>

JavaScript, will alert when page reaches "anotherElement":

window.addEventListener('scroll', function(){
  var place = document.body.scrollTop;
  var alertOn = document.getElementById('anotherElement').offsetTop;
  if(place > alertOn){
    alert('Function execute here');
    this.removeEventListener('scroll', arguments.callee, false);
  }
});

Post a Comment for "How To Execute A Js Function When The User Reaches A Specific Element In The Page?"