document.elementFromPoint in IE
<p>I have a nav bar fixed in the right of my page:</p>

<pre><code>&lt;dd data-year="2012"&gt;&lt;/dd&gt;               |2012| &lt;
&lt;dd data-year="2012"&gt;&lt;/dd&gt;               |2011|
&lt;dd data-year="2012"&gt;&lt;/dd&gt;               |2010|
&lt;dd data-year="2011"&gt;&lt;/dd&gt;                     
&lt;dd data-year="2011"&gt;&lt;/dd&gt;
&lt;dd data-year="2010"&gt;&lt;/dd&gt;
&lt;dd data-year="2010"&gt;&lt;/dd&gt;
...
</code></pre>

<p>When the use scroll the page, I'd like to highlight the right year on the right nav.</p>

<p>For example, if the use scroll to a dd with <code>data-year=2011</code>, then I'd highlight 2011 instead of the original 2012</p>

<p>I found a helpful function <code>document.elementFromPoint</code>, which will return the element above a specific point, for example <code>document.elementFromPoint(400, 300)</code> would return the element above (400, 300), then I can find current year with a loop to find a parentNode with <code>data-year</code>.</p>

<p>The code :</p>

<pre><code>      var element = document.elementFromPoint(600, 300),
          parent = MyLib.getParent(element, "dd");
      var year = MyLib.getData(parent, "year");
      highlightYear(year);
</code></pre>

<p>This works well in Chrome/Firefox, but when I test it in IE, <code>element</code> will always be <code>null</code>, but if I run <code>document.elementFromPoint(600, 300)</code> directly, I can get the right result.</p>

<p>How could I fix the problem? Or is there better way to implement this?</p>
