Menu
This is similar to SO: how to move a div with arrow keys, so maybe a clear and informed 'no' suffices as an answer:
Can I make an overflowing div a "default scroll target" that reacts to arrow-up/down/page-down/space the same way as an overflowing document (i.e. scrolls down the content)? The page itself does not have a scrollbar (simple example below). In particular, can this be accomplished without explicitly tracking key events (neither directly nor hidded by a JS library)?
<html>
<body>
<div id="contentcontainer" style="height:200px;width:200px;overflow:scroll">
<div id="innercontent" style="height:2000px;">foo</div>
</div>
</body>
</html>
Edit: Of course the above works after I click into the div. Basically, I want to avoid having to do that...
322
For vertical scrollable bar use the x and y axis. Set the overflow-x:hidden; and overflow-y:auto; that will automatically hide the horizontal scroll bar and present only vertical scrollbar. Here the scroll div will be vertically scrollable.
Set the overflow-y: hidden; and overflow-x: auto; that will automatically hide the vertical scroll bar and present only the horizontal scrollbar. The white-space: nowrap; property is used to wrap text in a single line. Here the scroll div will be horizontally scrollable.
To use the arrow keys to move between cells, you must turn SCROLL LOCK off. To do that, press the Scroll Lock key (labeled as ScrLk) on your keyboard. If your keyboard doesn't include this key, you can turn off SCROLL LOCK by using the On-Screen Keyboard.
A scrollable element is an element with a horizontal scroll distance or a vertical scroll distance greater than 0. horizontal scroll distance: The difference between scrollWidth and clientWidth for elements where the computed overflow-x is auto or scroll . Undefined for other elements.
In order for an html element to be focusable, it must be reachable with the Tab key. This means you can call .focus() on a link or an input. Additionally, body elements are always focusable.
You need to make your div reachable with the Tab key. You can accomplish this by setting the tabindex property on it. If you do not actually want people to be able to tab into that div, you can set the tabindex to -1, which will prevent people from actually tabbing to it but will otherwise set the element up for tabbing and focus.
Source: http://help.dottoro.com/ljpkdpxb.php
196
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
