PDA

Veure la Versió Completa: Ja fet Banderes de càrrega amb un sprite css



tavenger5
17-03-10, 16:54
He estat experimentant amb sprites CSS últimament i han observat que pot reduir trucades al servidor de manera significativa. Amb ells totes les banderes es va poder carregar a la vegada en lloc d'una rere l'altra. Això eliminaria de manera efectiva 52 trucades al servidor. Desafortunadament no hi ha manera fàcil de convertir les banderes en un sprite des de les etiquetes img són dinàmicament en el codi.

Hi ha una mica d'informació aquí: La creació de Sprites CSS fàcil i útil | Css Globe (http://cssglobe.com/post/3028/creating-easy-and-useful-css-sprites)

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

Ho sento per tots els suggeriments últimament:)

Edició - Crec que he trobat una manera de fer-ho. El nom del sprite només ha de correspondre amb el nom de la bandera / idioma. Alguns d'edició de 'vbenterprisetranslator_flag "hauria de funcionar.

Per tant, seria alguna cosa com això: (veure el canvi 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
17-03-10, 19:50
El estudiarem en detall en aquesta idea:) En aquest moment hem d'aprendre sobre CSS sprites i és el que realment pot millorar el rendiment (els navegadors estan emmagatzematge en memòria cau les imatges de totes maneres). Sol.licitud de posar en consideració:)

tavenger5
17-03-10, 20:57
Per cert, això és el que acabo d'utilitzar per posar-la en pràctica (jo no ús tots els 52, però els 13 més comuns)

El canvi de vbenterprisetranslator_flag dalt (sprites es pot canviar el que sigui - que utilitzen "banderes")

Aquesta imatge:
http://files.cellphoneforums.net/images/flags.png

Això sumat a css addicional:


.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
17-03-10, 21:31
Segons tinc entès destacant idioma actiu ja no funciona?

Anem a veure de prop el següent:)

tavenger5
17-03-10, 22:13
idioma actiu encara destaca - que utilitza un estil on els sprites utilitzar una classe

vBET
19-03-10, 02:07
Nice:) Estem definitivament la comprovi. De tota manera - primer que tenim molta feina amb el moviment de millores en el rendiment de vBET4.x a vBET3.x que sembla ser més important en aquests moments. Però la calma - tenim la seva sol.licitud a la llista de TOT:)

Snake
29-04-10, 23:19
Tinc aquesta semi-treball, però totes les meves imatges són la primera bandera mateixa, en el sprite.

vBET
11-06-10, 01:22
Fet. Comptarà amb el suport en la propera versió - per a tots els llocs on les banderes s'utilitzen:)

Automatic Translations (Powered by Google, Microsoft®, Yandex, SDL Language Cloud, IBM Watson and Apertium):
AfrikaansAlbanianArabicBelarusianBulgarianCatalanChineseCroatianCzechDanishDutchEnglishEstonianFilipinoFinnishFrenchGalicianGermanGreekHaitian CreoleHebrewHindiHungarianIcelandicIndonesianIrishItalianJapaneseKoreanLatvianLithuanianMacedonianMalayMalteseNorwegianPersianPolishPortugueseRomanianRussianSerbianSlovakSlovenianSpanishSwahiliSwedishTaiwaneseThaiTurkishUkrainianVietnameseWelshYiddish
vBET 4.10.1 brings automatic translations