Arrières-plans vectoriels (2)

Arrières-plans vectoriels (2)

26.09.2007

Hedger Wang a complété avant que je n’en ai moi-même le temps certains problèmes inhérents à l’utilisation d’images vectorielles en arrière-plan, donc je reprends directement son travail : il s’agit ici d’appliquer des images vectorielles afin d’obtenir dec blocs div avec bords arrondis.

Il a en effet utilisé Javascript (et la librairie YUI) pour appliquer le format adéquat SVG ou VML selon le navigateur client (FF et Opera pour SVG, VML pour IE).

L’exemple suivant est directement repris du sien : grossièrement, avec javascript on récupère la couleur d’arrière-plan du bloc pour injecter dans ce même bloc un rectangle de cette même couleur aux bords arrondis, au format VML ou SVG selon l’identifiant navigateur. Ce remplissage s’adapte à la taille du bloc parent avec des instructions CSS. L’opération est répétée pour tous les blocs (identifiés par une classe).

Voir l’exemple.

Evidemment cela reste du bricolage mais les librairies javascript pourront vraisemblablement apporter des solutions simplifiées à l’avenir, évitant le souci du navigateur client.

• Javascript
• CSS
• SVG
• VML
• YUI

Remonter.