nicht angemeldet
Hallo,
ich beschaeftige mich gerade mit einer Image-Selectbox. Das ist ein Widget, den ich mit Javascript generiere und der dazu dient, Bilder aus einem gegebenen Verzeichnis auszuwaehlen.
Das Ding sieht so aus
der genrierte Quellcode etwa so:
<div class="img-selectbox">
<div style="background-image: url(pics/test/pic003.png)">
<label>pic003.png</label>
<button type="button"></button>
</div>
<div>
<ul>
<li style="background-image:url(pics/test/pic001.png)">
<label>pic001.png</label>
</li>
<li style="background-image:url(pics/test/pic002.png)">
<label>pic002.png</label>
</li>
<li style="background-image:url(pics/test/pic003.png)">
<label>pic008.png</label>
</li>
<li style="background-image:url(pics/test/pic050.png)">
<label>pic050.png</label>
</li>
</ul>
</div>
<input value="pics/test/pic003.png" name="box" id="box" type="hidden">
</div>
Das funktioniert bis auf paar kleine Macken auch ganz gut, fuer 2 Probleme habe ich allerdings keine Loesung:
1. die Box mit den 'Options' sollte auch onblur verschwinden, d.h., wenn irgendwo ausserhalb geklickt wird, da es aber in Wirklickeit div, ul, li und label sind, funktioniert onblur hier nicht
2. Wenn ich eine 'Option' mit einem ueberlangen Bildernamen habe, haelt sich FF an die vorgegebene Breite der 'Optionbox', waehrend IE diese entsprechend verbreitert. Allerdings wird nur die betreffende Option breiter. Am liebsten waere mir, wenn wie bei der Original-Selectbox sich alle Options der laengsten anpassen wuerden, dazu braeuchte ich aber eine Methode, die Laenge des Textes in Pixeln herauszufinden. Wenn das nicht geht, muss ich einen Weg finden, IE vom Ausdehnen der Option abzuhalten.
Ich wuerde mich fuer jeden Denkansatz interessieren.
Nebenbei bemerkt, als ich das Bild auf meine Server hochgeladen habe, bin ich wieder ueber das hier gestolpert. Ich habe das schon mal vor gut einem Jahr gepostet, aber finde es immer noch ganz nett.
Gruß,
Dieter