I have this scrollable list
<ol>
<li>...</li>
...
</ol>
DEMO
Now, I can scroll programatically using
document.querySelector('ol').scrollTo(100);
But this doesn't work in Safari. Although this seems to be trivial, I cannot find the alternative (without using jQuery)
How to make the list scrollable in Safari?
I have this scrollable list
<ol>
<li>...</li>
...
</ol>
DEMO
Now, I can scroll programatically using
document.querySelector('ol').scrollTo(100);
But this doesn't work in Safari. Although this seems to be trivial, I cannot find the alternative (without using jQuery)
How to make the list scrollable in Safari?
Share edited Nov 25, 2015 at 20:38 Ram 3,09110 gold badges42 silver badges57 bronze badges asked Nov 25, 2015 at 19:56 Jeanluca ScaljeriJeanluca Scaljeri 29.2k66 gold badges233 silver badges380 bronze badges 2- Have you tried on other browsers i.e. Google Chrome or Firefox? Is it working there? – krishnaxv Commented Nov 25, 2015 at 20:10
-
On Google Chrome, it throws error,
Uncaught TypeError: document.querySelector(...).scrollTo is not a function
. You can refer my answer below. Thanks! – krishnaxv Commented Nov 25, 2015 at 20:42
2 Answers
Reset to default 3scrollTo
is a property of window
object. And you are trying to apply it on an element
.
Use
element.scrollTop
Code Snippet
document.querySelector('ol').scrollTop = 100;
It will do the trick!
For more information on scrollTo
& scrollTop
, refer Mozilla/Window/scrollTo & Mozilla/Element/scrollTop respectively.
NOTE
document.querySelector(selectors)
returns the first element within thedocument
. If yourdocument
contains multiple<ol>
elements, it will always return the first element.To select specific element, you can assign an
ID
& refer the element bydocument.querySelector('#ID')
.
Hope it helps!
I believe this will help you: Scroll to position WITHIN a div (not window) using pure JS
There is alternative way to get what you wished.