tengo un problema con el scroll. Funciona bien, pero quiero hacerlo instantáneamente sin ninguna animación, solo entonces la página se actualiza en el mismo lugar que antes sin desplazarse al lugar.
mi código js.
<script type = "text/javascript"> $(function() { $(window).scrollTop( $("#col-6").offset().top) }); </script>La estructura de mi proyecto, por ejemplo.
Primero incluyendo css y html
<?php include(html/css.php); some code.... <div class=col-6> some code.... </div> include(footer.php); ?>así que en el pie de página php después
<script src="assets/bootstrap/js/bootstrap.min.js"></script> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script> <script src="https://kit.fontawesome.com/5fbb5e690d.js" crossorigin="anonymous"></script> <script type="text/javascript" charset="utf8" src="https://cdn.datatables.net/1.10.25/js/jquery.dataTables.js"></script>Yo uso mi código js.
Y después de cargar la página, se desplaza a col-6 div. Pero, quiero estar instantáneamente sin ninguna animación o desplazamiento en qué lugar.
lo que intento
<script> $(window).on('beforeunload', function() { $('body').hide(); $(window).( $("#col-6").offset().top) }); </script>¿alguien tiene solución para eso?
Como usa jQuery, puede usar .animate() con un retraso de animación de cero milisegundos (instantánea).
Eso es .animate([property], [delay], [callback]) .
Para asegurarse de ocultar el efecto de desplazamiento muy rápido, puede ocultar toda la página (usando la opacity CSS en cero), luego, una vez que se haya completado el desplazamiento, restaure la opacidad.
$(document).ready(function() { // hide the whole page $("html").css({opacity:0}) // scroll and unhide the page using the complete callback $("html").animate({ scrollTop: $("#scroll_to_me").offset().top }, 0, ()=>$("html").css({opacity:1})) }) .space { height: 1000px; } <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <div class="space"></div> <div id="scroll_to_me">HERE</div> <div class="space"></div>