ansaurus

Question

Anyone know a mousehover trick/alternative which triggers when scrolling with keyboard

Answer 1

A:

Do you have a sample? I'm guessing that the layout of the elements on the page are blocking the mouseover event. My simple example below works as you described it should. With the cursor at the top of the page and using keyboard navigation, the mouseover events are fired.

<html>
<body>
<script>
function log(text)
{
    document.getElementById('logger').value += text + "\n";
}
</script>

<div id="div1" style="background: yellow; height: 100px;margin-top: 100px" onmouseover="log('mouseover div1');">
div1
</div>
<textarea id="logger" cols="60" rows="12" style="float:right;"></textarea>
<div id="div2" style="background: red; height: 1000px" onmouseover="log('mouseover div2');">
div2
</div>
</body>
</html>

Scott Stevenson 2009-06-10 17:45:29

This is similar to what I already have. It does not work on keyboard scrolling on Chrome, IE or Safari.

dsclementsen 2009-06-11 03:43:03

Answer 2

+1 A:

Unfortunately, it's quite complicated; you can no longer rely on the onMouseOver event - the only event that triggers when a page is scrolled is onScroll. The steps involved:

Go through elements, storing each of their widths, heights and offsets (distance from left/top of screen) in an array.
When the onScroll event is triggered check the last known position of the cursor against all chosen elements (go through the array) - if the cursor resides over one of the elements then call the handler.

Quick (unreliable) prototype: http://pastie.org/507589

J-P 2009-06-10 18:42:32

I like this idea. I personally would only need heights and y offsets as the divs / posts are listed vertically. I'll give this a shot.

dsclementsen 2009-06-11 03:44:48

ansaurus

tags:

views:

answers:

Anyone know a mousehover trick/alternative which triggers when scrolling with keyboard

related questions