Er is geen CSS ondersteuning.
Als de laatste versie van IE ook border-images gaat ondersteunen, is deze procedure makkelijk om in "het arsenaal" te hebben. Ook op het moment van schrijven is deze procedure best te gebruiken. Een browser die geen border-images ondersteunt zal niets merken van het niet aanwezig zijn van een mooie border.
De basis van de border is een kleine .gif file Het is een kleine moeite om in een willekeurig graphisch programma er zelf een te maken. De css-code is minimaal en staat hieronder. Als je een div (met een plaatje er in) de class "css3-border" meegeeft zal het resultaat zijn zoals het plaatje dat op deze pagina staat.
<style type="text/css">
.css3-border{
margin-left:100px;
position:relative;
display:inline-block}
.css3-border:after{
position:absolute;
top:-5px;
left:-5px;
bottom:-3px;
right:-5px;
content:" ";
border:10px solid;
-moz-border-image:url('http://static.dns5.nl/draaier-rood.gif') 20 20 20 20 stretch stretch;
-webkit-border-image:url('http://static.dns5.nl/draaier-rood.gif') 20 20 20 20 stretch stretch;
border-image:url('http://static.dns5.nl/draaier-rood.gif') 20 20 20 20 stretch stretch}
</style>
Ik krijg vaak de opmerking dat ik op bijna alle pagina's (ook deze) met plaatjes, deze met een stukje javascript inlaad (kijk even in de broncode van deze pagina). Het is echt niet nodig om dat te doen. De procedures werken ook zonder het javascript. De reden dat dit op de dns5 gebeurt, is dat we proberen alle html van alle pagina's binnen 0.3 seconde op het scherm te krijgen. De gebruikers-ervaring moet volkomen optimaal zijn, en al denk je dat een verschil van een ¼ seconde niets uitmaakt: het is echt wél zo. Als een bezoeker op een pagina komt mag hij(/zij) niets merken van wat voor vertraging dan ook. Ons ultieme streven is om alle pagina's binnen de 0.1 seconde te laten laden (voor wat de html betreft).
cache 25-11-2010