menu floating problemi con lo script

[AvOJaromil]

salve,

ho scaricato questo script da internet: http://www.jtricks.com/javascript/na...floating.html.
l'ho un po modificato poichè a me serviva solo il floating verticale.
il problema comunque esiste anche con lo script originale.

in pratica, il menu scorre assiemo allo scroll della pagina; quando si arriva in fondo il menu si ferma a poca distanza dal lato inferiore della finestra. il problema nasce quando questa finestra è più piccola del menu stesso, cioè quando l'altezza del menu supera l'altezza della pagina. scorrendo il menu segue lo scroll della pagina come deve fare però questa volta quando raggiunge il fondo della pagina, non si ferma e continua all'infinito. sicuramente un esempio sarà più chiaro : http://www.museodiartepovera.com/nuo...isco/index.htm

questo invece lo script:

/* Script by: [url]www.jtricks.com[/url]
 * Version: 20071210
 * Latest version:
 * [url]www.jtricks.com/javascript/navigation/floating.html[/url]
 */

var floatingMenuId = 'menu';
var floatingMenu =
{
    
    targetY: 223,

    hasInner: typeof(window.innerWidth) == 'number',
    hasElement: document.documentElement && document.documentElement.clientWidth,

    menu: document.getElementById ? document.getElementById(floatingMenuId) : document.all ? document.all[floatingMenuId] : document.layers[floatingMenuId]
};

floatingMenu.move = function ()
{
    if (document.layers) {floatingMenu.menu.top = floatingMenu.nextY;}
    else {floatingMenu.menu.style.top = floatingMenu.nextY + 'px';}
}

floatingMenu.computeShifts = function ()
{
    var de = document.documentElement;
    floatingMenu.shiftY = floatingMenu.hasInner ? pageYOffset : floatingMenu.hasElement ? de.scrollTop  : document.body.scrollTop;
}

floatingMenu.doFloat = function()
{
    var stepY;

    floatingMenu.computeShifts();

    stepY = (floatingMenu.shiftY + floatingMenu.targetY - floatingMenu.nextY) * .07;
    
    if (Math.abs(stepY) < .5)
    {
        stepY = floatingMenu.shiftY + floatingMenu.targetY - floatingMenu.nextY;
    }
    
    if (Math.abs(stepY) > 0)
    {
        floatingMenu.nextY += stepY;
        floatingMenu.move();
    }

    setTimeout('floatingMenu.doFloat()', 20);
};

// addEvent designed by Aaron Moore
floatingMenu.addEvent = function(element, listener, handler)
{
    if(typeof element[listener] != 'function' || typeof element[listener + '_num'] == 'undefined')
    {
        element[listener + '_num'] = 0;
        if (typeof element[listener] == 'function')
        {
            element[listener + 0] = element[listener];
            element[listener + '_num']++;
        }
        element[listener] = function(e)
        {
            var r = true;
            e = (e) ? e : window.event;
            for(var i = element[listener + '_num'] -1; i >= 0; i--)
            {
                if(element[listener + i](e) == false)
                    r = false;
            }
            return r;
        }
    }

    //if handler is not already stored, assign it
    for(var i = 0; i < element[listener + '_num']; i++)
        if(element[listener + i] == handler) return;
    element[listener + element[listener + '_num']] = handler;
    element[listener + '_num']++;
};

floatingMenu.init = function()
{
    floatingMenu.initSecondary();
    floatingMenu.doFloat();
};

// Some browsers init scrollbars only after
// full document load.
floatingMenu.initSecondary = function()
{
    floatingMenu.computeShifts();
    floatingMenu.nextY = floatingMenu.shiftY + floatingMenu.targetY;
    floatingMenu.move();
}

if (document.layers)
    floatingMenu.addEvent(window, 'onload', floatingMenu.init);
else
{
    floatingMenu.init();
    floatingMenu.addEvent(window, 'onload', floatingMenu.initSecondary);
} 

[cavicchiandrea]

Io ho provato il link con ff 2.0, è fa quanto descritto prosegue lo scroll anche a fine pagina cosa che non fa con ie 7 per me è un problema legato al menu nel div che si muove visto che oltre ad uscire (con tutti e due i browser) con ff l'ultimo link si posiziona sotto la barra, io controllerei anche i css.

[AvOJaromil]

questa è la riga che rigauarda il css del menu:

div#menu{position:absolute;left:735px;width:179px;height:308px;padding:10px; border:dotted #9cc 1px;background:#666 url('../img/riga.gif') top left repeat; text-align:left; } 

gli attributi top e left servono solo nel caso uno abbia js disabilitato, poichè questi valori vengono assegnati dalla script.

comunque il problema lo da anche l'esempio che c'è nel sito dell'autore dello script. se si rimpicciolisce la pagina fino ad avere una parte del menu sotto la parte visibile della finestra, questo non si ferma.

questa parte si occupa di calcolare la quantita di spostamento e autorizzarlo

floatingMenu.doFloat = function()
{
    var stepY;

    floatingMenu.computeShifts();

    stepY = (floatingMenu.shiftY + floatingMenu.targetY - floatingMenu.nextY) * .07;
    
    if (Math.abs(stepY) < .5)
    {
        stepY = floatingMenu.shiftY + floatingMenu.targetY - floatingMenu.nextY;
    }
    
    if (Math.abs(stepY) > 0)
    {
        floatingMenu.nextY += stepY;
        floatingMenu.move();
    }

    setTimeout('floatingMenu.doFloat()', 20);
}; 

bisognerebbe aggiungere una condizione su floatingMenu.move() per controllare che la posizione attuale del menu floatingMenu.nextY sommata all'altezza del menu che in questo caso è 440px, non superi la reale altezza della pagina. in pratica però non so come fare....

qualche aiuto?

mille grazie

[cavicchiandrea]

Oggi ho visitato il tuo sito con IE6 (dall'ufficio) ed è un disastro, ne vale veramente la pena? Hai provato a cercare altri script?