This is the series of commands I just executed. If I apply scrollTop without referring an object or class, the console returns an error. If I execute scrollTop[100], the console top returns that information but nothing happens. I applied the last command $[".content"].scrollTop[100] to another page and it worked. This last page wasn't build using Outsystems, as far as I know.
Jovvy
You always need to use "$" dollar sign symbol to invoke a jquery function.
Try to use $[document].scrollTop [your desired value] and let me know how it goes.
João Miguel Santos
I applied those two commands but nothing happened.
Mariela Mayorga
Hi Joao, Did you solved this? I have the same issue.
Hi mariela,
Scrollto will work, but you have to take into account the whole page and their overflows in containers.
If the html got a container which will handle the overflow you can scrollto the documen as much as you like but there will be no effect.
That said, what is your issue exactly? Could you share an oml where it is happening?
Mariela Mayorga
Hi. Yes, maybe that's what is happening. As soon as I can, I'll try to upload a small oml with the behaviour I'm getting.
When I scroll my page half way down, then trigger a reload, I want the page to go pack to the top, but instead it tries to find the last scroll position. So I did this:
$['document'].ready[function[] { $[window].scrollTop[0]; }];
But no luck.
EDIT:
So both your answers worked when I call them after the page loads-Thanks. However, if I just do a refresh on the page, looks like the browser calculates and scrolls to its old scroll position AFTER the .ready event [I tested the body onload[] function too].
So the follow up is, is there a way to PREVENT the browser scrolling to its past position, or to re-scroll to the top AFTER it does its thing?
Last update on August 19 2022 21:50:45 [UTC/GMT +8 hours]
jQuery Practical exercise Part - I : Exercise-2
Scroll to the top of the page with jQuery.
Sample solution :
HTML Code :
` Scroll to the top of the page with jQuery
jquery
jquery
jquery
jquery
jquery
jquery
jquery
jquery
jquery
jquery
jquery
jquery
jquery
jquery
jquery
jquery
jquery
jquery
jquery
jquery
jquery
jquery
jquery
jquery
jquery
jquery
jquery
jquery
jquery
jquery
jquery
jquery
Go Top`
JavaScript Code :
`$["a[href='
top']"].click[function[] {
$["html, body"].animate[{ scrollTop: 0 }, "slow"]; return false; }]; `
See the Pen jquery-practical-exercise-2 by w3resource [@w3resource] on CodePen.
Contribute your code and comments through Disqus.
Previous: Test if jQuery is loaded. Next: Disable right click menu in html page using jquery.
What is the difficulty level of this exercise?
Test your Programming skills with w3resource's quiz.
- Weekly Trends and Language Statistics
- Weekly Trends and Language Statistics
How do you scrollTo the top of the page in jQuery?
In jQuery, the scrollTo[] method is used to set or return the vertical scrollbar position for a selected element. This behavior can be used to scroll to the top of the page by applying this method on the window property. Setting the position parameter to 0 scrolls the page to the top.
Why my scroll top is not working?
If your CSS html element has the following overflow markup, scrollTop will not function. To allow scrollTop to scroll, modify your markup remove overflow markup from the html element and append to a body element.
How to get window scroll top position in jQuery?
jQuery scrollTop[] Method The scrollTop[] method sets or returns the vertical scrollbar position for the selected elements. Tip: When the scrollbar is on the top, the position is 0. When used to return the position: This method returns the vertical position of the scrollbar for the FIRST matched element.
How to make page scrollTo top in JavaScript?
Solution 1: Using the scrollTo[] Method This method allows you to scroll to a specific coordinate on the page. To scroll to the top, we need to set the x and y coordinates to 0. method to scroll to the top of the page. By setting the x and y coordinates to 0, we ensure that the page scrolls to the top-left corner.