Sprites CSS - plus qu'un simple «performance amicale" avec le plugin jQuery follet

Sprites CSS sont utilisées dans la conception web "normal" pour une variété de séquences d'images à utiliser les performances de l'environnement.

Une application typique est un changement graphique avec "mouse-over".

Une possibilité serait de quelque chose pour chaque état (à la souris et souris) pour produire un fichier d'image et de définir le changement via le code CSS. Cette méthode doit être chargé 2 fichiers physiques à partir de serveurs Web via requête http - pas si grand pour les performances.

Lors de l'utilisation sprites CSS sont deux séquences d'images dans un fichier situé adjacent à l'autre ou les uns avec les autres et l'image de changement de sens, à son tour par CSS (fond de l'image). Quelle est la section de la séquence d'images est affichée est déterminée par l'attribut CSS "background-position". Dans cette variante est un seul fichier physique par l'intermédiaire de charge requête http et donc la performance est sympathique.

Dans l'exemple ci-dessus, il y avait seulement deux séquences d'images. Les sprites sont vraiment efficace que si elle est une séquence entière d'images - similaires à un flip book-- est (par exemple un oiseau voletant, une personne en cours d'exécution, etc.)

Ce plugin follet

Quelles autres possibilités sprites CSS impliquer, vous montre le plugin jQuery follet . Avec les options de configuration simples peuvent être simulés animations fantastiques. Une excellente solution pour ceux qui insistent encore sur Flash.

Consultez le site Web à absolument plugin! Il l'a présenté Möglichkietn impressionnante.

Liens supplémentaires à propos Sprites CSS:

• jQuery et CSS sprite d'animation expliqué en 5 minutes
• CSS sprites simplement expliqué
• Sprites CSS - 1 Performance Site Web
• Sprites CSS: Qu'est-ce qu'ils sont, pourquoi ils sont cools, et comment les utiliser
• Sprites CSS w / out Utilisation d'images d'arrière-plan
• Afficher les icônes en utilisant une seule image et CSS "sprites"
• Enregistrement de la bande passante et la vitesse du site Améliorer l'aide CSS Sprites