window.onResize werkt niet in IE8

Status
Niet open voor verdere reacties.
F

famlam

Gebruiker
Lid geworden
15 okt 2008
Berichten
416
[JS]window.onResize = myResizeFunction();[/JS]

bovenstaande code werkt in alle browsers (incl. IE7, want toen ik het schreef gebruikte ik IE7), maar niet in IE8!
Hoe laat ik deze toch werken in IE8???

(op het internet vond ik wel dat dit een bug was in de beta en de RC1 van IE8, maar nergens dat het nog steeds een bug was in de 'uitgekomen' versie van IE8)
 
probeer in plaats van de 'onResize=' een event handler te gebruiken.
[JS]window.attachEvent('onresize', doeIets);

function doeIets()
{
alert('test');
}[/JS]
 
Vegras zei:
probeer in plaats van de 'onResize=' een event handler te gebruiken.
[JS]window.attachEvent('onresize', doeIets);

function doeIets()
{
alert('test');
}[/JS]
Klik om te vergroten...
Bedankt voor je tip!

Uiteindelijk is het dit geworden:
[JS]if (navigator.appName.indexOf("Microsoft Internet Explorer") >= 0 && navigator.userAgent.indexOf('Avant Browser') === -1) {
window.attachEvent('onresize', resizefunctie);//alleen ondersteund door IE
}
else {
window.onresize = resizefunctie;//andere browsers
}[/JS]

Aangezien alle andere (veelvoorkomende) browsers window.onresize wel ondersteunen heb ik die wel gebruik laten maken van window.onresize.
 
Oh, op die manier

Nou, dan kan je beter zowiezo een eventHandler script gebruiken. Bijvoorbeeld die van Johnny: http://ejohn.org/blog/flexible-javascript-events/. Deze gebruikt ipv browser-detection (is echt 'evil') de wat logischere function-detectie. Check de code maar, het wordt vanzelf duidelijk


:thumb:


[edit]
hier is die van mij, vind ik iets netter
[js]
function addEventBeestje(elem, event, functie, geefDoor)
{
if(elem.addEventListener)
{
//de goede manier

elem.addEventListener(event, functie, geefDoor);
}else if(elem.attachEvent){
//IE

elem.attachEvent('on' + event, functie);
}else{
//geen van bijde; doe .onxxxx
elem['on' + event] = functie;
}
}
[/js]
[js]
addEventBeesje(window, 'resize', resizefunctie, false);[/js]
[/edit]
 
Laatst bewerkt:
[...]Nou, dan kan je beter zowiezo een eventHandler script gebruiken. Bijvoorbeeld die van Johnny: http://ejohn.org/blog/flexible-javascript-events/. Deze gebruikt ipv browser-detection (is echt 'evil') de wat logischere function-detectie. Check de code maar, het wordt vanzelf duidelijk
[...]
Klik om te vergroten...

Wat is precies het voordeel van een eventHandler t.o.v. de on-code?

En geldt dit ook voor de <body onload="initH"> onload?
 
een event handler is zoals de naam al zegt, een 'iets' wat een event handled.


de element.onxxxx is een niet-gestandariseerde manier van een event handler. Bijna elke browser onderstuend het echter.

In plaats darvan zijn er andere manieren. De 'standaard' methode is de addEventHandle(). IE heeft zn eigen methode (go figure), namelijk attachEvent. Als niets werkt, kan je voor de 'oude' methode gaan, nl. de 'onxxxx'.



Je onload gaat ook zo:
[js]
addEventBeesje(body, 'load', initH, false);[/js]
:thumb:
 
Laatst bewerkt:
Vegras zei:
[js]function addEventBeestje(elem, event, functie, geefDoor)
{
if(elem.addEventListener) { //de goede manier
elem.addEventListener(event, functie, geefDoor);
}else if(elem.attachEvent){ //IE
elem.attachEvent('on' + event, functie);
}else{ //geen van bijde; doe .onxxxx
elem['on' + event] = functie;
}
}
[/js]
[js]
addEventBeesje(window, 'resize', resizefunctie, false);[/js]

Je onload gaat ook zo:[js]addEventBeesje(body, 'load', initH, false);[/js]
Klik om te vergroten...

Deze codes werken sowieso niet als je addEventBeesje(...) gebruikt, met een functie genaamt addEventBeestje :)

De tweede code werkt niet met body, echter wel met 'window' i.p.v. body. (de load eventHandler)

En geen van beide codes ('load' en 'resize') wordt ge'trigger'd in Google Chrome.
Enig idee waarom niet?

(o ja, bestaat er een nederlands woord voor ge'trigger'd in de context van een event uitvoeren? Het staat zo raar, dat ge'trigger'd.)
 
Hmmmm.... hey, niet vervelend doen! Ik heb die code uit mn hoofd geschreven, zonder te testen :p ;)

Als ik weer op een normale computer zit (nu even niet dus), zal ik t verder even testen. Naar mijn weet doet chrome alles zoals safari etc. doet, maar dit kan ik niet met zekerheid zeggen.


(o ja, bestaat er een nederlands woord voor ge'trigger'd in de context van een event uitvoeren? Het staat zo raar, dat ge'trigger'd.)
Klik om te vergroten...
getrigeert? :p Ik weet het niet. google translate zegt 'leverde' op 'triggered', maargoed, dat klinkt stom. Doe maar gewoon getriggered ofzo :D
 
Hm, dan doe je toch echt iets fout. Deze code werkt in chrome en FF:

test.html
HTML: 
<script>
function addEventBeestje(elem, event, functie, geefDoor)
{
   if(elem.addEventListener)
   {
      //de goede manier
 
      elem.addEventListener(event, functie, geefDoor);
   }else if(elem.attachEvent){
      //IE
 
      elem.attachEvent('on' + event, functie);
   }else{
      //geen van bijde; doe .onxxxx
      elem['on' + event] = functie;
   }
}


function laadfunctie()
{
   alert('size');
}


addEventBeestje(window, 'resize', laadfunctie, false);

</script>
 
Vegras zei:
Hm, dan doe je toch echt iets fout. Deze code werkt in chrome en FF:
test.html
Klik om te vergroten...

Nu heb ik deze code letterlijk tussen de <head>'s geplakt, en nu krijg ik twee keer achter elkaar de 'size' alert.
(overigens, dat hij het de vorige keer niet deed bij mij was omdat ik zo stom was geweest om Resize in te typen i.p.v. resize... en Resize doet geen ene moer... of nog minder. Foutje, sorry)

Dus nu wordt de code dus twee keer uitgevoerd (zowel op Chrome als IE). Zo had ik hem staan om te testen (komt door geen enkele validator heen natuurlijk, maar om te testen is het voldoende)
HTML: 
<html><head><script>function addEventBeestje(elem, event, functie, geefDoor) {
   if(elem.addEventListener) { //de goede manier
       elem.addEventListener(event, functie, geefDoor);
   }else if(elem.attachEvent){ //IE
      elem.attachEvent('on' + event, functie);
   }else{ //geen van bEIde; doe .onxxxx
      elem['on' + event] = functie;
	} }
function laadfunctie()
{ alert('size'); }
addEventBeestje(window, 'Resize', laadfunctie, false);
</script><title>.</title></head><body>DitIsEenTestPagina</body></html>
 
[js]addEventBeestje(window, 'Resize', laadfunctie, false);
[/js]
Klik om te vergroten...
Ja, maar dan moet je het niet nogmaals fout doen in je voorbeeld code he? :p Anywho - ik krijg hier inderdaad ook dubbele meldingen bij chrome en IE. Firefox doet het wel 'goed'. Overgens ligt dit aan de browser, en niet aan het script; heb even een testje gedraaid, en ze voegen maar 1 van de 3 handler toe.


:thumb:
 
Status
Niet open voor verdere reacties.
                    Steun ons                    

Nieuwste berichten

Terug
Bovenaan Onderaan