Deus Figendi: Lupe- Funktion

Beitrag lesen

Ich bin mir nicht 100%ig sicher aber ich meine die Browser würden erst dann laden, wenn das Hintergrundbild gesetzt wird.
Eben, und dann entsteht eine Verzögerung, die man bei einem Hover-Effekt nicht haben möchte.

Ja, natürlich... du kannst nicht beides haben, kein Pre-load und dennoch unverzögertes Anzeigen, man muss schon wissen was man will ^^
Ich denke bei durchschnittlich aufgelösten Bildern kann man mit den 200-2000 Millisekunden Verzögerung leben.

Ansonsten, wenn man beides will, kann man sich jetzt sowas ausdenken wie zu messen wann der Cursor in die Nähe kommt und dann schonmal laden, aber das Laden verwerfen wenn der Cursor sich entfernt und... also das scheint mir etwas aufwendig. Entweder riesieges Pre-Load oder eben kleine Verzögerungen. Das ist aber unabhängig von der Technik...

Naja vielleicht geht es doch, erdenken wir uns folgendes:

<div class="outer">  
 <div class="inner"></div>  
</div>

Und nun machen wir folgendes, wir geben dem Inneren ein bisschen Abstand und ein Thumbnail als Hintergrundbild und zentrieren es im äußeren div.
Wenn das outer ge-hovert wird ändern wir das Hintergrundbild im Inneren:

.outer:hover .inner {  
 background-image:url(./goszes.Bild);  
}  
/* Und vergrößern wenn das innere erreicht wird */  
.inner:hover {  
 width:800px;  
 height:600px;  
}

Sollte klappen... so hat man die Verzögerung verringert.

--
sh:( fo:| ch:? rl:( br:& n4:& ie:{ mo:} va:) de:µ_de:] zu:) fl:( ss:| ls:[ js:(