Dropdown-Liste mit Bildern

Frank · 26 Juli 2006

Hi Community,

Ich habe mal eine kleine aber feine Frage.

Ist es möglich, in ein dropdown liste Bilder einzubauen?
Bis jetzt habe ich es auf die normale art und weise mit einem <img> tag versucht

HTML:

<select>
<option><img src="bild.jpg"></option>
</select>

Leider Funktioniert diese Methode nicht.

Ich suche nun eine Lösung dafür.
Dank.

XraYSoLo · 26 Juli 2006

wäre mir nicht bekannt, dass das überhaupt funktioniert.

Nils aka XraYSoLo

Verhueterli · 27 Juli 2006

Also mittels <img> geht das definitiv nicht.

Du könntest <select> ein Hintergrundbild zuordnen. Dann brauchst du allerdings noch eine Methode, die das <select> so groß (hoch, breit) macht, dass man das Bild auch ganz sehen kann.

Generell bin ich der Meinung, dass das zumindest mit <select> nicht geht.

Mit JavaScript kann man so etwas sicher skripten, ist aber recht komplex und schwierig.

Frank · 27 Juli 2006

Ich habe eine Methode gefunden.

geht aber leider nur in MF und Opera:

HTML:

<html>
<head>
<style type="text/css">
<!--
 
option[value=Australien]:before {
 content: url("australien.gif");
}
option[value=Deutschland]:before {
 content: url("deutschland.gif");
}
option[value=Frankreich]:before {
 content: url("frankreich.gif");
}
option[value=Kuba]:before {
 content: url("kuba.gif");
}
option[value=Mexiko]:before {
 content: url("mexiko.gif");
}
option[value=USA]:before {
 content: url("usa.gif");
}
 
-->
</style>
<title>DropDown-Menü mit Grafiken</title>
</head>
<body>
 
<select size="1">
<option value="Australien"> Australien</option>
<option selected value="Deutschland"> Deutschland</option>
<option value="Frankreich"> Frankreich</option>
<option value="Kuba"> Kuba</option>
<option value="Mexiko"> Mexiko</option>
<option value="USA"> USA</option>
</select>
 
</body>
</html>

Dropdown-Liste mit Bildern

Frank

Neues Mitglied

XraYSoLo

Senior HTML'ler

Verhueterli

Neues Mitglied

Frank

Neues Mitglied

Neueste Beiträge