Perché il menu YUI è in attesa del caricamento delle immagini della mia pagina?

Question

Modifica: Questo è un bug confermato in jQuery 1.3.1. È stato risolto in jQuery 1.3.2.

---

Ho un controllo del menu YUI esattamente come questo esempio con sottomenu nella parte superiore.

Ho provato a usare il codice di Yahoo per inizializzare il menu:

YAHOO.util.Event.onContentReady("mnuTopNav", function() {

    var oMenuBar = new YAHOO.widget.MenuBar("mnuTopNav", {
        autosubmenudisplay: true,
        hidedelay: 750,
        lazyload: true
    });

    oMenuBar.render();
});

Riscontro problemi con le pagine che contengono immagini che richiedono tempo per il caricamento.

Ho notato che i titoli apparivano all'istante (Comunicazione / Shopping / Intrattenimento), ma che le piccole frecce che indicavano che c'erano sotto-elementi non sarebbero apparse fino a quando non fossero state caricate tutte le immagini.

L'ho pensato molto strano. Ho anche provato a cambiare il codice su JQuery per vedere se si sarebbe inizializzato prima che il caricamento delle immagini fosse terminato (ecco cosa $ (function () pensavo dovesse fare).

$(function(){


        var oMenuBar = new YAHOO.widget.MenuBar("mnuTopNav", {
            autosubmenudisplay: true,
            hidedelay: 750,
            lazyload: true
        });

        oMenuBar.render();
});

Con mia grande sorpresa ho avuto ancora lo stesso problema. Il menu non si inizializza fino a quando non viene caricata l'intera pagina.

Sono sicuramente le immagini che si stanno aspettando.

Nota: questo problema è solo in Internet Explorer. Firefox sembra sollevare questo evento onContentReady PRIMA che le immagini vengano caricate.

Posso aggirare questo problema?

---

Modifica: questo è un bug confermato in jQuery 1.3.1. È stato corretto in jQuery 1.3.2.

Answer 1

OnContentReady di Yahoo (...) sembra attendere il caricamento delle immagini per qualche motivo, quindi ho smesso di usarlo.

Inoltre sembra esserci un bug JQuery su come $ (function () {}); lavori

Vedi questo post da parte mia cercando di ottenere dettagli più specifici sulla questione.

Answer 2

Hai provato a usare YUI onAvailable () invece di onContentReady ()? Da i documenti di YUI :

  

Il metodo onContentReady condivide un   sintassi identica con onAvailable. Il   differenza materiale tra i due   metodi è che onContentReady attende   fino a quando sia l'elemento target che il suo   nextGemling nel DOM risponde a   getElementById. Questo lo garantisce   sarà il contenuto dell'elemento target   hanno caricato completamente (eccetto qualsiasi   contenuto dinamico che potresti aggiungere in seguito   tramite script). Se onContentReady mai   rileva un prossimo fratello, spara con   l'evento window.load.

Suppongo che il browser debba caricare le immagini sul DOM prima che l'attributo nextSibling funzioni, quindi onContentReady () lo sta aspettando.

Answer 3

per jQuery dovresti farlo:

    $(document).ready(function(){


        var oMenuBar = new YAHOO.widget.MenuBar("mnuTopNav", {
            autosubmenudisplay: true,
            hidedelay: 750,
            lazyload: true
        });

        oMenuBar.render();
   });