(newbe lunghetto) moofx + fade nella stessa pagina

[moralizzatore]

Salve a tutti,
mi ritrovo a dover utilizzare due script per ottenere due effetti in
una pagina web:

- il primo utilizza MooFX e lo uso per gli ormai diffusissimi pannelli
a scomparsa che si trovano a inizio pagina (vedi es.
http://techfoolery.com o l'italiano http://tomstardust.com)
- il secondo utilizza uno scrit fade.js basato sul codice di
http://www.couloir.org/ e riadattato da
http://www.clagnut.com/blog/1299/ per ottenere un effetto fade sul
caricamento di immagini corredato anche da un immaginetta di loading
stile web2.0

Bene il problema è che stranamente (mai successo prima) su explorer
tutto funziona normalmente,mentre in firefox.. il pannello a scomparsa
non è fluido ma va a scatti, cioè si apre e si chiude con molta
difficoltà. Se non inserisco l'effetto fade il pannello torna a
funzionare in maniera fluida.

La situazione della mia pagina tralasciando l'inutile è piu o meno
questa:

<title>pagina prova</title>
<script type="text/javascript" src="js/prototype.lite.js"></script>
<script type="text/javascript" src="js/moo.fx.js"></script>
<script src="js/scriptaculous.js" type="text/javascript"></script>
<script src="js/pannello.js " type="text/javascript"></script>
<script type="js/fade.js "></script>

<div id="pannello">
     <div id="contenuto-pannello">
      </div>
</div>

<div id="container">
       <div id="grande">
       </div>
</div>

Questo il contenuto dello script pannello.js

 var opened=false;

    window.onload = function() {

        resizeDivHeight = new fx.Height('pannello',{duration:2000});

    };

    function toggelopen(){

        if(opened==false){

            resizeDivHeight.custom(0,200);//First Number is starting
height, Second is ending height.

            opened=true;

        }else{

            resizeDivHeight.custom(200,0);//First Number is starting
height, Second is ending height.

            opened=false;

        }

    }

E questo il contenuto dello script fade.js

/*

Better(?) Image fader (C)2004 Patrick H. Lauke aka redux

Inspired by Richard Rutter / Clagnut http://www.clagnut.com/blog/1299/

Original concept and code adapted from Couloir http://www.couloir.org/

preInit "Scheduler" idea by Cameron Adams aka The Man in Blue
http://www.themaninblue.com/writing/...ve/2004/09/29/

*/

/* general variables */

var fadeTargetId = 'grande'; /* change this to the ID of the fadeable
object */
var     fadeTarget;
var preInitTimer;
preInit();

/* functions */

function preInit() {
        /* an inspired kludge that - in most cases - manages to initially hide
the image
           before even onload is triggered (at which point it's normally too
late, and a nasty flash
           occurs with non-cached images) */
        if
((document.getElementById)&&(fadeTarget=document.getElementById(fadeTargetId)))
{
                fadeTarget.style.visibility = "hidden";
                if (typeof preInitTimer != 'undefined') clearTimeout(preInitTimer);
/* thanks to Steve Clay http://mrclay.org/ for this small Opera fix */
        } else {
                preInitTimer = setTimeout("preInit()",1);
        }

}

function fadeInit() {
        if (document.getElementById) {
                /* get a handle on the fadeable object, to make code later more
manageable */
                preInit(); /* shouldn't be necessary, but IE can sometimes get ahead
of itself and trigger fadeInit first */
                /* set the initial opacity in a (hopefully) cross browser way
                   notice that because of the way the image is in front, and not
obfuscated
                   by another object we need to "fade out", i don't need a fallback
mechanism
                   to show/hide the covering object...the image is just there, full
stop */
                if (fadeTarget.style.MozOpacity!=null) {
                        /* Mozilla's pre-CSS3 proprietary rule */
                        fadeTarget.style.MozOpacity = 0;
                } else if (fadeTarget.style.opacity!=null) {
                        /* CSS3 compatible */
                        fadeTarget.style.opacity = 0;
                } else if (fadeTarget.style.filter!=null) {
                        /* IE's proprietary filter */
                        fadeTarget.style.filter = "alpha(opacity=0)";
                }
                /* make the object visible again */
                fadeTarget.style.visibility = 'visible';
                window.setTimeout("fadeIn(0)", 500);
        }

}

function fadeIn(opacity) {
        if (fadeTarget) {
                if (opacity <= 100) {
                        if (fadeTarget.style.MozOpacity!=null) {
                                /* Mozilla's pre-CSS3 proprietary rule */
                                fadeTarget.style.MozOpacity = (opacity/100)-.001;
                                /* the .001 fixes a glitch in the opacity calculation which
normally results in a flash when reaching 1 */
                        } else if (fadeTarget.style.opacity!=null) {
                                /* CSS3 compatible */
                                fadeTarget.style.opacity = (opacity/100)-.001;
                        } else if (fadeTarget.style.filter!=null) {
                                /* IE's proprietary filter */
                                fadeTarget.style.filter = "alpha(opacity="+opacity+")";
                                /* worth noting: IE's opacity needs values in a range of 0-100, not
0.0 - 1.0 */
                        }
                        opacity += 10;
                        window.setTimeout("fadeIn("+opacity+")", 30);
                }
        }

}

/* initialise fader by hiding image object first */
addEvent (window,'load',fadeInit)

/* 3rd party helper functions */

/* addEvent handler for IE and other browsers */
function addEvent(elm, evType, fn, useCapture)
// addEvent and removeEvent
// cross-browser event handling for IE5+,  NS6 and Mozilla
// By Scott Andrew
{
 if (elm.addEventListener){
   elm.addEventListener(evType, fn, useCapture);
   return true;
 } else if (elm.attachEvent){
   var r = elm.attachEvent("on"+evType, fn);
   return r;
 }

}

------------

Su explorer tutto fila liscio... su firefox pannello scattoso.. mi date
una mano?
Grazie mille

[br1]

Benvenuto nel forum

Non e' buona norma impostare intervalli di tempo cosi' brevi... al processore non rimane tempo di fare altro

Prova ad aumentare da un millisecondo a qualcosina di piu'

preInitTimer = setTimeout("preInit()",1);

ciao

[moralizzatore]

Originariamente inviato da br1
Benvenuto nel forum

Grazie per il benvenuto!

Non e' buona norma impostare intervalli di tempo cosi' brevi... al processore non rimane tempo di fare altro

Prova ad aumentare da un millisecondo a qualcosina di piu'

preInitTimer = setTimeout("preInit()",1);

ciao

Ah quel manuale di javascript che ho lasciato a pagina 38!!
Grazie mille! Adesso funziona!