0
166
Viewscontenido div en javascript html inferior desplazado
Quiero preguntar sobre el oyente de desplazamiento de contenido div (no la página). entonces tengo un código html donde la apariencia del diseño web se asemeja a una aplicación nativa. lo que quiero hacer es ¿cómo detecto si el usuario se ha desplazado hacia abajo en el div de contenido? no una pagina porque mi pagina web para el solo es muda, sino la que se mueve en el div. mi código div es algo como esto
<div class="product-list-item"> //product card //product card </div> 
y cuando me desplazo así
Quiero ver otros productos usando ajax cuando llegue al final del div, por ahora sigo usando el botón manual para cargar otros productos.
He usado este código pero no funciona.
<script> $(window).scroll(function() { if($(window).scrollTop() == $(document).height() - $(window).height()) { // ajax call get data from server and append to the div } }); </script>¿Alguien tiene una solución para esto? Gracias de antemano.
1 answers
Answer question0
Suponiendo que tienes esto:
<div class="product-list-item" id="target"> //product card //product card </div>Puede usar este script para verificar si alcanzó su div objetivo:
<script> $(window).scroll(function() { if ($(this).scrollTop()+$(this).height() >= $('#target').position().top) { console.log('Target Reached'); } }); </script>Puede usar este enfoque para ejecutar el código solo una vez, una vez que haya alcanzado el div de destino
<script> let isReached = false; $(window).scroll(function() { if ($(this).scrollTop()+$(this).height() >= $('#ftr').position().top && isReached == false) { isReached = true; //ajax call } }); </script>