i have problem with scroll. Its working fine, but i want to make it instantly without any animation, just then page refreshing be the same place as before without scrolling to the place.
my js code.
<script type = "text/javascript">
$(function() {
$(window).scrollTop( $("#col-6").offset().top)
});
</script>
My project structure for example.
First including css and html
<?php
include(html/css.php);
some code....
<div class=col-6>
some code....
</div>
include(footer.php);
?>
so in footer php after
<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>
i use my js code.
And after page load its scrolling to col-6 div. But, i want instantly without any animation or scrolling be in what place.
What i try
<script>
$(window).on('beforeunload', function() {
$('body').hide();
$(window).( $("#col-6").offset().top)
});
</script>
any1 have solution for it ?
Since you use jQuery, your can use .animate() with an animation delay of zero milliseconds (instantaneous).
That is .animate([property], [delay], [callback]).
To make sure to hide the very quick scroll effect, you can hide the whole page (using the CSS opacity at zero), then after the scroll has completed, restore the opacity.
$(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>