Banderas de carga con un sprite css

[tavenger5]

He estado experimentando con sprites CSS últimamente y han observado que puede reducir llamadas al servidor de manera significativa. Con ellos todas las banderas se pudo cargar a la vez en lugar de una tras otra. Esto eliminaría de manera efectiva 52 llamadas al servidor. Desafortunadamente no hay manera fácil de convertir las banderas en un sprite desde las etiquetas img son dinámicamente en el código.

Hay un poco de información aquí: La creación de Sprites CSS fácil y útil | Css Globe (http://cssglobe.com/post/3028/creating-easy-and-useful-css-sprites)

CSS Sprites generador (http://csssprites.com/)

Lo siento por todas las sugerencias últimamente:)

Edición - Creo que he encontrado una manera de hacerlo. El nombre del sprite sólo tiene que corresponderse con el nombre de la bandera / idioma. Algunos de edición de 'vbenterprisetranslator_flag "debería funcionar.

Por lo tanto, sería algo como esto: (ver el cambio en img src)


<a rel="novbseo" href="$url" <if condition="$code==$vbulletin->options['vbenterprisetranslator_forumlanguage']">onclick="document.cookie = 'vbet_language=; expires=Thu, 01-Jan-1970 00:00:01 GMT; path=/'; return true;"</if>><img class="sprite $code" src="/clear.gif" alt="$name" <if condition="$vbulletin->options['vbenterprisetranslator_flags_noborder'] && !$highlight">border="0"</if><if condition="$highlight">border="1" style="border-color: yellow"</if>/></a>

[vBET]

Lo estudiaremos en detalle en esta idea:) En este momento tenemos que aprender acerca de CSS sprites y es lo que realmente puede mejorar el rendimiento (los navegadores están almacenamiento en caché las imágenes de todos modos). Solicitud de poner en consideración:)

[tavenger5]

Por cierto, esto es lo que acabo de utilizar para ponerla en práctica (yo no uso todos los 52, pero los 13 más comunes)

El cambio de vbenterprisetranslator_flag arriba (sprites se puede cambiar lo que sea - que utilizan "banderas")

Esta imagen:
http://files.cellphoneforums.net/images/flags.png

Esto sumado a css adicional:


.sprite {background:url(/images/flags.png); width: 16px; height: 11px;}

.ar {background-position: -0px -0px;}
.zh-CN {background-position: -17px -0px;}
.en {background-position: -34px -0px;}
.fr {background-position: -51px -0px;}
.de {background-position: -68px -0px;}
.it {background-position: -85px -0px;}
.ja {background-position: -102px -0px;}
.ko {background-position: -119px -0px;}
.pl {background-position: -136px -0px;}
.pt {background-position: -153px -0px;}
**** {background-position: -170px -0px;}
.es {background-position: -187px -0px;}
.nl {background-position: -204px -0px;}

[vBET]

Según tengo entendido destacando idioma activo ya no funciona?

Vamos a ver de cerca lo siguiente:)

[tavenger5]

idioma activo todavía destaca - que utiliza un estilo donde los sprites utilizar una clase

[vBET]

Nice:) Estamos definitivamente la compruebe. De todos modos - primero que tenemos mucho trabajo con el movimiento de mejoras en el rendimiento de vBET4.x a vBET3.x que parece ser más importante en estos momentos. Pero la calma - tenemos su solicitud en la lista de TODO:)

[Snake]

Tengo esta semi-trabajo, pero todas mis imágenes son la primera bandera misma, en el sprite.

[vBET]

Hecho. Contará con el apoyo en la próxima versión - para todos los lugares donde las banderas se utilizan:)