Σημαίες Φορτίο με CSS Sprite

[tavenger5]

Έχω πειραματίζονται με CSS sprites πρόσφατα και διαπίστωσε ότι μπορεί να περικόψει σημαντικά κλήσεις διακομιστή. Με όλα αυτά από τις σημαίες θα μπορούσαν να φορτωθούν με τη μία αντί για ένα μετά το άλλο. Αυτό θα εξαλείψει ουσιαστικά 52 κλήσεις διακομιστή. Δυστυχώς δεν υπάρχει εύκολος τρόπος να μετατρέψετε τις σημαίες σε ένα ξωτικό δεδομένου ότι τα img tags δυναμικά ενσωματωμένο στον κώδικα.

Υπάρχουν κάποιες πληροφορίες εδώ: Δημιουργία εύκολο και χρήσιμο Παιδάκια CSS | CSS Globe (http://cssglobe.com/post/3028/creating-easy-and-useful-css-sprites)

CSS Παιδάκια γεννήτρια (http://csssprites.com/)

Συγγνώμη για όλες τις προτάσεις που τον τελευταίο καιρό:)

Επεξεργασία - Νομίζω ότι βρήκα έναν τρόπο να το κάνει. Το όνομα του sprite έχει μόνο να αντιστοιχεί στο όνομα της σημαίας / γλώσσα. Κάποια επεξεργασία των «vbenterprisetranslator_flag» θα πρέπει να εργαστεί.

Γι 'αυτό θα είναι κάπως έτσι: (βλ. την αλλαγή 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]

Θα εξετάσουμε πιο κοντά σε αυτήν την ιδέα:) Αυτή τη στιγμή έχουμε να μάθουμε για CSS Sprite και δεν μπορεί πραγματικά να βελτιώσει τις επιδόσεις (browsers είναι προσωρινή αποθήκευση εικόνων έτσι κι αλλιώς). Αίτηση τεθεί υπόψη:)

[tavenger5]

BTW, εδώ είναι αυτό που ακριβώς χρησιμοποιείται για την εφαρμογή του (εγώ δεν χρησιμοποιούν όλα τα 52, αλλά τα 13 πιο κοινό)

Η αλλαγή στην vbenterprisetranslator_flag παραπάνω (Sprite μπορεί να μετονομαστεί σε οτιδήποτε άλλο - θα χρησιμοποιείται «σημαιών»)

Αυτή η εικόνα:
http://files.cellphoneforums.net/images/flags.png

Αυτό προστίθεται επιπλέον CSS:


.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]

Όπως αντιλαμβάνομαι τονίζοντας ενεργό γλώσσας δεν θα λειτουργεί πια;

Θα εξετάσουμε κοντά σε αυτό:)

[tavenger5]

ενεργή γλώσσα τονίζει ακόμα - που χρησιμοποιεί ένα στυλ όπου sprites χρήση μιας τάξης

[vBET]

Νίκαια:) Εμείς οριστικά, θα το ελέγξουμε. Τέλος πάντων - πρώτα έχουμε πολλή δουλειά με τα κινούμενα βελτιώσεις στην απόδοση από vBET4.x να vBET3.x που φαίνεται να είναι πιο σημαντικό αυτή τη στιγμή. Αλλά να είστε ήρεμοι - έχουμε το αίτημά σας στη λίστα TODO:)

[Snake]

Έχω αυτό το ημι-εργασίας, αλλά όλες οι εικόνες μου είναι το ίδιο πρώτο σημαία, στο ξωτικό.

[vBET]

Τέλος. Θα υποστηριχθεί στην επόμενη έκδοση - για όλα τα μέρη όπου σημαίες χρησιμοποιούνται:)