JS Div hiding and DHTML scroller combo woes

[Gizmo]

Hi all,

I was wondering if anyone might have any thoughts on this. I am trying to implement two things on one one my pages.

The first is this:
A DHTML scroller [a href=\"http://meddle.dzygn.com/eng/weblog/scroller.mod/\" target=\"_blank\"]http://meddle.dzygn.com/eng/weblog/scroller.mod/[/a]

The second is this:
Javascript/CSS method for hiding divs one on top of the other (can be with a tabbed interface) and when a user clicks a link the relevant div is made visible. Code:
[code]/*
This code is based on a code example from the article "Javascript navigation - cleaner, not meaner" by Christian Heilmann
URL: http://www.evolt.org/article/Javascript_navigation_cleaner_not_meaner/17/60273/index.html
*/

// If there is enough W3C DOM support for all our show/hide behavior:
// 1. Call the stylesheet that by default hides all toggleable sections
// 2. Apply the show/hide behavior by calling the initialization function
if (document.getElementById && document.getElementsByTagName && document.createTextNode) {
    document.write('<link rel="stylesheet" type="text/css" href="css/hide.css" />');
    window.onload = initShowHide;
}

function initShowHide() {
    // Hide all toggleable sections with JavaScript for the highly improbable case that CSS is disabled
    // Note that in this case the 'flash of visible content' still will occur
    // For testing purposes you can add the following code to disable CSS: document.getElementsByTagName('link')[0].disabled = true;
    hide();
    var toggle = document.getElementById('toggle');
    var as = toggle.getElementsByTagName('a');
    for (var i = 0; i < as.length; i++) {
        as[i].onclick = function() {
            show(this);
            return false;
        }
    }
}

function show(s) {
    hide();
    var id = s.href.match(/#(\w.+)/)[1];
    document.getElementById(id).style.display = 'block';
}

function hide() {
    var toggling = document.getElementById('toggling').getElementsByTagName('div');
    for (var i = 0; i < toggling.length; i++) {
        toggling[i].style.display = 'none';
    }
}[/code]

The problem is, I can get these two things to work seperately. I have the divs flicking on and off on one page, and the scroller working on a similar page (testing them both seperately). The problem is when the the two are combined. At the moment the toggable divs javascript file is included in the header. Then the scroller is initialised (also in the header). All the DIV content dissappears which is good. However, when i then click a link to make a div visible, it becomes visible but the scroller won't scroll the div. The div is a fixed height but I cannot access the content that would require the scroller to scroll down to reach it.

I'm thinking that somehow I need to call the scroller again once the div is made visible? But no idea how.

Does any of this make sense to anyone? I need to scroll the divs that are originally hidden once I have made them visible. Any thoughts?

cheers
;)