Come posso allegare un listener di eventi di ridimensionamento della finestra in JavaScript?

Realizzo un plugin JS/PHP per la distribuzione. Io voglio che sia facile da installare come questo:Come posso allegare un listener di eventi di ridimensionamento della finestra in JavaScript?

<HTML> 
<HEAD> 
<TITLE>Testing my Plugin</TITLE> 
<?php 
    include 'path/to/myPlugin.php'; 
    echo getMyPluginHeadContent(); 
?> 
</HEAD> 
<BODY> 
<?php 
    echo getMyPluginContent("Arguments will go here"); 
?> 
</BODY> 
</HTML>

Tuttavia, voglio che questo plugin per allegare una finestra ridimensionare ascoltatore senza ignorando window.onresize, nel caso in cui ci sono altri script che richiedono anche l'uso di quel metodo. Esiste un comando javascript come document.addEventListener("resize", myResizeMethod, true);? So che non è così, perché non funziona, e MDN e W3C sono molto vaghi su quali argomenti assume addEventListener.

Non voglio una risposta che mi dica di utilizzare window.onresize = myResizeMethod o <BODY ONRESIZE="myResizeMethod">, in quanto non sono compatibili con i plug-in.

fonte

2012-11-30 Supuhstar

Dal momento che si sta cercando di aggiungere questo alla finestra, hai provato 'window.addEventListener'? – Kyle

Praticamente qualsiasi .on = può essere trasformato in un .addEventListener (, ) – bhamlin

@bhamlin: commento Ipocrisia, grazie. –

Dal momento che si sta tentando di chiamare questa funzione sul ridimensionamento della finestra, si vuole associare la funzione alla finestra e non al documento. Per supportare versioni di IE che sono meno di 9, si vorrà utilizzare attachEvent. Si prega di notare che attachEvent richiede di specificare la parola chiave on. Ecco un esempio:

if(window.attachEvent) { 
    window.attachEvent('onresize', function() { 
     alert('attachEvent - resize'); 
    }); 
} 
else if(window.addEventListener) { 
    window.addEventListener('resize', function() { 
     console.log('addEventListener - resize'); 
    }, true); 
} 
else { 
    //The browser does not support Javascript event binding 
}

Allo stesso modo, è possibile rimuovere gli eventi nello stesso modo

if(window.detachEvent) { 
    window.detachEvent('onresize', theFunction); 
} 
else if(window.removeEventListener) { 
    window.removeEventListener('resize', theFunction); 
} 
else { 
    //The browser does not support Javascript event binding 
}

fonte

2012-11-30 19:03:08 Kyle

+1 per una risposta più completa della mia. –

Oltre a dimenticare un ');' nel codice di esempio, questo è perfetto! Grazie! – Supuhstar

@Supuhstar Oops, corretto il codice. Sono contento che tu sia riuscito a farlo funzionare. – Kyle

Non si ridimensiona il documento ma la finestra. Questo funziona:

window.addEventListener("resize", function(){console.log('resize!')}, true);

fonte

2012-11-30 18:53:32

In aggiunta a questo, si vorrà usare 'attachEvent' per le versioni di IE <9. – Kyle

@Kyle non lo sapevo (i miei siti non sono compatibili con IE8 o jquery). Sentiti libero di costruire la tua risposta. Vedo nel tuo commento che sapevi anche per la finestra e il documento. –

Grazie. Pubblicherò una risposta in un minuto con un esempio. – Kyle

Come posso allegare un listener di eventi di ridimensionamento della finestra in JavaScript?

risposta

Problemi correlati