Spry HTMLPanel preloader works...sort of...need some help

Question

Hello everyone :
I have been fighting with this htmlpanel preloader for over 2 weeks now and I'm frustrated beyond words.
http://1g2s.arena-i.com
Hit portfolio, then any of the clients
Currently, the preloader appears to work. And by appears to work I mean, it seems to preload the html (which is only 0.8k and loads quickly) but it doesn't seem to wait for the 250k +/- image inside the html as part of the preload. The preloading animated gif is only on screen for a split second, then the page appears, then the image loads.
- The container that loads the htmlpanel ("content-center") has the class="HTMLPanelLoading"
- There's another container in it with the class="HTMLPanelLoadingContent"
===========================================
The current script, does this:
- Fades out the container
- Loads the new page into it
- Fades it back in
<script type="text/javascript">
            var hp4 = new Spry.Widget.HTMLPanel("content-center", {evalScripts: true});
            function hpanelFade(theURL){
                var obs1 = {onPostUpdate:function(){openContent.start();}};
                openContent.start();
                openContent.addObserver(obs1);
                var effectObs = {onPostEffect:function(){hp4.loadContent(theURL);}};
                var obs = {onPostUpdate:function(){openIt.start();}};
                closeIt.start();
                closeIt.addObserver(effectObs);
                hp4.addObserver(obs);
            var openContent = new Spry.Effect.Fade("content-wrap", {to: '100', duration:0, toggle:false});
            var closeIt = new Spry.Effect.Fade("content-center",{from: '100', to: '0', duration:500});
            var openIt  = new Spry.Effect.Fade("content-center",{to: '100', duration:400});
         </script>
===========================================
I found this but don't know where/how to implement it within the context of the script above --or-- if incorporating this will even work :
<script language="JavaScript" type="text/javascript">
   // Create an HTMLPanel widget and bind it to the element with
   // the id of "samplePanel".
   var hpanel = new Spry.Widget.HTMLPanel("samplePanel");
   // Add a function as an observer of the panel.
   function myObserverFunc(notificationType, notifier, data)
      if (notificationType == "onPostUpdate")
         alert("onPostUpdate fired!");
   hpanel.addObserver(myObserverFunc);
   // Add an object as an observer of the panel.
   var obs = new Object;
   obs.onPostUpdate = function(notifier, data) { alert("onPostUpdate was fired!"); };
   hpanel.addObserver(obs);
   // Remove the observers that were added.
  hpanel.removeObserver(myObserverFunc);
  hpanel.removeObserver(obs);
</script>
These are the two pages I've been using for reference...
http://labs.adobe.com/technologies/spry/articles/html_panel/index.html
http://labs.adobe.com/technologies/spry/articles/data_api/apis/html_panel.html
Has anyone been able to implement this correctly??!?!?!?!

Answer 1

...