CSSスプライトを使用したロードフラグ

[tavenger5]

私は、最近のCSSスプライトを試し、それが大幅にサーバー呼び出しを減らすことができることがわかってきました。彼らとのフラグのすべては、一度ではなく、順次にロードすることができます。これは実質的に52のサーバの呼び出しを削除してしまうことになります。残念なことにimgタグを動的にコードに組み込まれているので、スプライトにフラグを変換する簡単な方法はありません。

いくつかの情報はここにある： 簡単で便利なCSSスプライトを作成| CSSグローブ

CSSスプライトジェネレータ

すべての提案のため申し訳ありませんが最近

編集 - 私はそれを行うための方法を見つけたと思う。スプライトの名前は、単にフラグ/言語の名前に対応する必要があります。 "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スプライトについて学ぶために、それが実際に（ブラウザでは、とにかく画像をキャッシュしている）のパフォーマンスを向上させることができるではありません持っている。要求は考慮に入れ

[tavenger5]

ところで、ここで私はちょうどそれを実装するために使用されるものです（私はすべての52を使用しませんが、最も一般的な13）

上記vbenterprisetranslator_flagへの変更（スプライトはどんな名前を変更できる - 私は"フラグ"を使用）

この画像：


これは追加の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]

アクティブな言語は、依然として強調 - スプライトのクラスを使用するスタイルを使用していること

[vBET]

ニース 我々は決定的にそれをチェックします。とにかく - まずはvBET4.xから今より重要であると思われるvBET3.xにパフォーマンスの向上を移動することで多くの仕事を持っている。しかし冷静になる - 私たちは、TODOのリストにあなたの要求を持っている

[Snake]

私は半働き、これを持っていますが、すべて私のイメージはスプライトで、同じ最初のフラグです。

[vBET]

行って。次のリリースでサポートされる予定です - フラグが使用されているすべての場所のために