IE9 vs .style.display="none"?

I’m a novice. Please overlook the old code and forgive my ignorance.

http://www.rogue-eagles.org/Newsletters/NewsCat3h-IE.htm

  1. Open the page and see a calendar of newsletters followed by a “webmaster’s note”.
  2. Reduce the height of the browser window to less than the height of the viewable content.
  3. Note the length of the “thumb” in the scrollbar.
  4. Click the “webmaster’s note” to hide it. (a JavaScript action)
    FYI: This page uses a “sticky footer”.
  5. Note that the footer is properly placed at the bottom of the window.
  6. HOWEVER, notice that the “thumb” in the scrollbar did not change.
  7. Scroll down and find that the space formerly occupied by the “webmaster’s note” now appears beneath the “sticky footer”.

Because this particular feature works in FF and IE8, I assume this is an IE9 bug.
Any advice is welcome. Is it possible for JavaScript to tell IE9 to recalculate the length of the visible content after the “note” is dismissed?

This page has one other problem. IE8 does not respond to the “hide new” button. I don’t know how else to write that function. Recommendations would be appreciated.


var newlinks = new Array();
newlinks = getElementsByClassName('newlinks');    // getElementsByClassName function in use for IE8
function NewLinks() {
    if ( newlinks[0].innerHTML == 'hide<br>new' ) {
        HideNewLinks();
    } else {
        ShowNewLinks();
    }
}

Finally, a feature wish! If looking at the 2010 catalog (for example), I would like the visible portion of the page to remain as-is in the viewport when “show all” is clicked and the content area is expanded, rather than jumping to the current year (2012) when the content is expanded. Can anyone point me to a resource where I might learn how to do that?

Thanks in advance.

The second issue, the one about the ‘hide new’ button, has been solved. It seems that IE8 expects the tag returned by the innerHTML call to be UPPER CASE. (Learned how to write an “or” condition.) :slight_smile: