Another Google Translate Widget with Image Sprites

Another Google Translate Widget with Image Sprites (6kb img + 5,5kb html)

sample:


Widget Content:

<!-- Translate flag BEGIN -->
<style>
ul#translate-flag {padding:0;margin:0;}
#translate-flag li {list-style: none;float:left;_display:inline;padding:0;margin:1px;width:16px;height:11px;background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjG6wLWMfi5LoYEljgnF4EgId9NShpaC1K49Rwoi3DQwt_37JmoVKKIbIZBQEsaxlVPteptjoLpDs7ddUaIf6ApaISJNWX4tz82J_ykjEgl7yFUd6BbgzqAxmyKhyuWhDW2oL0Onq2gIno/);background-repeat:no-repeat;}
#translate-flag li a{display:block;width:16px;height:11px;cursor: pointer;}
</style>
<ul id="translate-flag">
<li id="german" style="background-position: 0px -66px;"><a onclick="href='http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&amp;langpair=en|de&amp;hl=de'" title="Translate to German"></a></li>
<li id="french" style="background-position: 0px -55px;"><a onclick="href='http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&amp;langpair=en|fr&amp;hl=fr'" title="Translate to French"></a></li>
<li id="italian" style="background-position: 0px -110px;"><a onclick="href='http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&amp;langpair=en|it&amp;hl=it'" title="Translate to Italian"></a></li>
<li id="spanish" style="background-position: 0px -198px;"><a onclick="href='http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&amp;langpair=en|es&amp;hl=es'" title="Translate to Spanish"></a></li>
<li id="greek" style="background-position: 0px -77px;"><a onclick="href='http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&amp;langpair=en|el&amp;hl=el'" title="Translate to Greek"></a></li>
<li id="portuguese" style="background-position: 0px -154px;"><a onclick="href='http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&amp;langpair=en|pt&amp;hl=pt'" title="Translate to Portuguese"></a></li>
<li id="arabic" style="background-position: 0px -11px;"><a onclick="href='http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&amp;langpair=en|ar&amp;hl=ar'" title="Translate to Arabic"></a></li>
<li id="russian" style="background-position: 0px -176px;"><a onclick="href='http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&amp;langpair=en|ru&amp;hl=ru'" title="Translate to Russian"></a></li>
<li id="chinese" style="background-position: 0px -22px;"><a onclick="href='http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&amp;langpair=en|zh-CN&amp;hl=zh-CN'" title="Translate to Chinese"></a></li>
<li id="estonia" style="background-position: 0px -33px;"><a onclick="href='http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&amp;langpair=en|et&amp;hl=et'" title="Translate to Estonian"></a></li>
<li id="finnish" style="background-position: 0px -44px;"><a onclick="href='http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&amp;langpair=en|fi&amp;hl=fi'" title="Translate to Finnish"></a></li>
<li id="hindi" style="background-position: 0px -88px;"><a onclick="href='http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&amp;langpair=en|hi&amp;hl=hi'" title="Translate to Hindi"></a></li>
<li id="indonesian" style="background-position: 0px -99px;"><a onclick="href='http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&amp;langpair=en|id&amp;hl=id'" title="Translate to Indonesian"></a></li>
<li id="japanese" style="background-position: 0px -121px;"><a onclick="href='http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&amp;langpair=en|ja&amp;hl=ja'" title="Translate to Japanese"></a></li>
<li id="persian" style="background-position: 0px -132px;"><a onclick="href='http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&amp;langpair=en|fa&amp;hl=fa'" title="Translate to Persian"></a></li>
<li id="norwegian" style="background-position: 0px -143px;"><a onclick="href='http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&amp;langpair=en|no&amp;hl=no'" title="Translate to Norwegian"></a></li>
<li id="romanian" style="background-position: 0px -165px;"><a onclick="href='http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&amp;langpair=en|ro&amp;hl=ro'" title="Translate to Romanian"></a></li>
<li id="slovak" style="background-position: 0px -187px;"><a onclick="href='http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&amp;langpair=en|sk&amp;hl=sk'" title="Translate to Slovak"></a></li>
<li id="swedish" style="background-position: 0px -209px;"><a onclick="href='http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&amp;langpair=en|sv&amp;hl=sv'" title="Translate to Swedish"></a></li>
<li id="turkish" style="background-position: 0px -242px;"><a onclick="href='http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&amp;langpair=en|tr&amp;hl=tr'" title="Translate to Turkish"></a></li>
<li id="thai" style="background-position: 0px -231px;"><a onclick="href='http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&amp;langpair=en|th&amp;hl=th'" title="Translate to Thai"></a></li>
<li id="malay" style="background-position: 0px 0px;"><a onclick="href='http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&amp;langpair=en|ms&amp;hl=ms'" title="Translate to Malay"></a></li>
<li id="vietnamese" style="background-position: 0px -253px;"><a onclick="href='http://translate.google.com/translate?u='+encodeURIComponent(location.href)+'&amp;langpair=en|vi&amp;hl=vi'" title="Translate to Vietnamese"></a></li>
</ul>
<!-- Translate flag END -->