Toon posts:

[JavaScript] Plaatjes preloaden

Pagina: 1
Acties:

Verwijderd

Topicstarter
Ik ben bezig een script te maken dat voor een link een plaatje laat zien bij een rollover.
Dit werkt, het probleem is alleen dat het een soort lag in IE veroorzaakt.

http://www.eujogo.com - Let niet op broken images e.d., het gaat om het effect bij de tweede rij.

Dit ligt niet aan het preloaden van het plaatje voorzover ik kan zien, want op http://www.gratisspiele.cc werkt het wel zonder lag (zijn dezelfde plaatjes).

Heeft iemand een idee waar dit aan kan liggen?

Link naar JS EuJogo: http://www.eujogo.com/thumbs_follow.js
Link naar JS GratisSpiele: http://www.gratisspiele.cc/thumbs.js


Dit topic stond eerst in P&W, daar schreef de mod het volgende:
Ik zou je topic kunnen moven naar daar, maar dat doe ik niet, omdat er essentiele informatie ontbreekt.
Ipv weblinks te spammen naar sites waar dat script gebruikt wordt, post je beter wat relevante code.
Hoe dit spam kan zijn bergijp ik niet, het gaat hier om een Portigese en een Duitse site.
En voor die ene backlink van een Nederlandse site..
Verder post ik wel degelijk de relevante code, namelijk een link naar de JS file waar alles instaat.

  • crisp
  • Registratie: Februari 2000
  • Laatst online: 11:33

crisp

Devver

Pixelated

Ik neem aan dat gratisspiele.cc ook gewoon van jou is, en je het script ook daadwerkelijk zelf geschreven hebt.

Allereerst: er worden geen plaatjes gepreload; op gratisspiele.cc wordt er bij de mouseover ook gewoon een request gedaan om het plaatje op te halen. Blijkbaar is de host (en mijn internetverbinding) snel genoeg om het te laten lijken dat ze wel gepreload waren.

Wat je moet doen is dus gewoon met javascript een preloader maken; in de meest simpele vorm ziet dat er zo uit:
JavaScript:
1
2
var preloadimage = new Image();
preloadimage.src = 'plaatje.gif';

Bij het swappen verwijs je dan naar je preloaded image:
code:
1
2
var image = document.getElementById('myImage');
image.src = preloadimage.src;

Intentionally left blank


Verwijderd

Topicstarter
Dat klopt, maar bij gratisspiele.cc preload ik de images ook niet.
Toch gaat het bij gratisspiele.cc in IE zonder lag en op eujogos.com met.
Beide sites staan op de zelfde server.
Vreemd is ook dat FF bij eujogos.com geen lag geeft en IE wel.
Het lijkt mij dus dat er iets mis is met de javascript code, niet met het downloaden van de plaatjes, iets dat IE moeite kost maar FF niet.

  • Mr_Gee
  • Registratie: September 2001
  • Laatst online: 07-04 11:35

Mr_Gee

Ik Heb Gesproken

Heeft het er niet mee te maken dat de ene een fixed locatie gebruikt en de ander naast je muis te voorschijn komt?
e.g. misschien dat dat nou juist die lag is omdat t op een relative plek moet komen?

mbt tot preloaden, wat nou als je een script/html ding in d pagina zet die de plaatjes binnenhaald maar niet laat zien?
ik zat zelf te denken aan :
[img]"plaatje.jpg"[/img]
dan wordt t plaatje alvast in het cache gezet, en kan je daarna het zelfde plaatje gebruiken in je script.

Ik weet niet of t werkt maar tis maar een idee

[ Voor 48% gewijzigd door Mr_Gee op 18-02-2006 13:58 ]

Proffesioneel Platzak


  • crisp
  • Registratie: Februari 2000
  • Laatst online: 11:33

crisp

Devver

Pixelated

Probeer in elk geval je referenties naar DOM-objecten te cachen; elke keer een getElementById doen vreet performance en ik kan me voorstellen dat dat ook deels verantwoordelijk is voor de delay.

Intentionally left blank


Verwijderd

crisp schreef op zaterdag 18 februari 2006 @ 15:19:
Probeer in elk geval je referenties naar DOM-objecten te cachen; elke keer een getElementById doen vreet performance en ik kan me voorstellen dat dat ook deels verantwoordelijk is voor de delay.
Met cachen bedoel je dan die getElementById() in een var te zetten??

Verwijderd

Topicstarter
Cachen heb ik geprobeerd, maar dat werkt ook niet.
Als je snel over een kolom heen gaat met je muis geeft hij ook kleurverandering <li> element niet meer weer in IE, in FF wel.
IE geeft dit wel weer als je javascript weghaalt.
Er is dus echt iets dat CPU/geheugen vreet.

  • crisp
  • Registratie: Februari 2000
  • Laatst online: 11:33

crisp

Devver

Pixelated

Je onmousemove handler doet nog steeds lookups bij elke muisbeweging. Wellicht is het handiger om je picture-layer pas op de juiste plaats te zetten op het moment dat er daadwerkelijk een plaatje getoont moet worden (dus opnemen in je setPic method).

Overigens is het eenvoudig te testen of die positionering de bottleneck is: disable gewoon even je mousemove handler ;)

[ Voor 22% gewijzigd door crisp op 18-02-2006 18:52 ]

Intentionally left blank


Verwijderd

Topicstarter
Dat ga ik wel proberen.

[ Voor 50% gewijzigd door Verwijderd op 19-02-2006 11:47 ]

Pagina: 1