Hello.

Are there any plugins under jQuery to send an Ajax request when a certain block (say with id = "load_on_screen") appears in the view area on the screen?

Or how to do it yourself? Where to dig? scrollUp is not suitable.

  • $ ("#load_on_screen") .load (function () {}); - Kostiantyn Okhotnyk
  • What do you mean by "scope"? On a good window, the user is immediately visible. If you need to scroll to the block (ie, it is not on the visible part of the form from the very beginning), it is best to do the processing through scrolling (i.e., calculate a certain height from the top of the document and set it to value on the trigger) - alexoander
  • @alexoander yes, you need to scroll to the block. But on the page there are several blocks that need to be loaded not immediately, but when scrolling and appearing in the field of view. And they are all at different distances from the top. On it it is necessary to write 3 handlers. And how else? - Alex_01
  • @KonstantinOkhotnick Read the comment above - Alex_01
  • The handler will be 1 - just the numbers will be different and the events will be different to the response (that is, the parameters will be transferred to one handler). Other options (fast) I do not see. I do not remember such triggers as appearing on the screen. - alexoander

1 answer 1

function inWindow(s){ var scrollTop = $(window).scrollTop(); var windowHeight = $(window).height(); var currentEls = $(s); var result = []; var offset = currentEls.offset(); if(scrollTop <= offset.top && (currentEls.height() + offset.top) < (scrollTop + windowHeight)) return true; return false; } var boxesInWindow = inWindow("#sc-2"); console.log(boxesInWindow); $(document).scroll(function () { if(inWindow("#sc-2")) { console.log('1'); } }); 
 .sc-1 { width:100%; height:500px; background:red } .sc-2 { width:100%; height:300px; background:green } 
 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <div id="sc-1" class="sc-1"> </div> <div id="sc-2" class="sc-2"> </div>

In general, there is a library lazy load as an option to use it

  • Does not work. All time false stands - Alex_01