mediengestalter.info
Datenschutzerklärung
FAQ :: Mitgliederliste :: MGi Team

Willkommen auf dem Portal für Mediengestalter
Aktuelles Datum und Uhrzeit: Mi 24.04.2024 20:13 Benutzername: Passwort: Auto-Login

Thema: DropDown felder formatieren vom 10.05.2006


Neues Thema eröffnen   Neue Antwort erstellen MGi Foren-Übersicht -> Allgemeines - Nonprint -> DropDown felder formatieren
Seite: 1, 2  Weiter
Autor Nachricht
powdaer
Threadersteller

Dabei seit: 20.11.2002
Ort: Regensburg
Alter: 39
Geschlecht: Weiblich
Verfasst Mi 10.05.2006 15:53
Titel

DropDown felder formatieren

 Antworten mit Zitat Zum Seitenanfang
Ich brauche eure Hilfe:
Kann man bei DropDown Feldern per CSS den Rahmen und den "Kasten mit dem Pfeil" ändern?

Hab schon überall gesucht, aber noch nichts gefunden.

Danke schonmal
  View user's profile Private Nachricht senden
sahnemuh

Dabei seit: 19.06.2003
Ort: /dev/null
Alter: 42
Geschlecht: Männlich
Verfasst Mi 10.05.2006 16:28
Titel

Antworten mit Zitat Zum Seitenanfang
rahmen ist browserabhängig, den pfeil kann man nicht ändern, da OS generiert.

alternativ gehts nur mit css / js ein dropdown zu simulieren.
  View user's profile Private Nachricht senden
Anzeige
Anzeige
njow

Dabei seit: 23.04.2006
Ort: Löhne
Alter: 38
Geschlecht: Männlich
Verfasst Mi 10.05.2006 16:31
Titel

Antworten mit Zitat Zum Seitenanfang
hallo,

du hast die möglichkeit jedes feld einzeln zu formatieren.

css file / oder inline
Code:

select {
 background-color: #666666;
 font: 12pt Verdana, Arial, sans-serif;
}
 
.format1 {
 background-color: #e3e3e3;
}

.format2 {
 color: #a5a5a5;
}


select
Code:

<select>
   <option class="format1">option #1</option>
   <option class="format2">option #2</option>
   <option class="format1">option #3</option>
</select>


um dir die genauen parameter ( eigenschaften für css ) anzuschauen, würd ich einfach mal googeln.

mfg barry
  View user's profile Private Nachricht senden
powdaer
Threadersteller

Dabei seit: 20.11.2002
Ort: Regensburg
Alter: 39
Geschlecht: Weiblich
Verfasst Mi 10.05.2006 16:35
Titel

Antworten mit Zitat Zum Seitenanfang
hm, muss ich wohl weitersuchen,
danke für eure Hilfe!
  View user's profile Private Nachricht senden
sahnemuh

Dabei seit: 19.06.2003
Ort: /dev/null
Alter: 42
Geschlecht: Männlich
Verfasst Mi 10.05.2006 16:53
Titel

Antworten mit Zitat Zum Seitenanfang
powdaer hat geschrieben:
hm, muss ich wohl weitersuchen,
danke für eure Hilfe!


da hilft auch kein suchen. __geht nicht__
  View user's profile Private Nachricht senden
beeviZ

Dabei seit: 30.09.2002
Ort: -
Alter: -
Geschlecht: Männlich
Verfasst Mi 10.05.2006 21:48
Titel

Antworten mit Zitat Zum Seitenanfang
tut schon gehen. mit ner menge javascript. von daher sollte man sich dreimal überlegen ob man da nich doch lieber die finger von lassen sollte.
  View user's profile Private Nachricht senden
sahnemuh

Dabei seit: 19.06.2003
Ort: /dev/null
Alter: 42
Geschlecht: Männlich
Verfasst Mi 10.05.2006 22:46
Titel

Antworten mit Zitat Zum Seitenanfang
sag ich ja. ohne "dhtml" voodo dropdown scheisse (was aus accessibilty / usability und aufwands sicht ein no-go ist) ist da nix zu machen.
  View user's profile Private Nachricht senden
sidisinsane

Dabei seit: 30.01.2006
Ort: Hamburg
Alter: 52
Geschlecht: Männlich
Verfasst Do 11.05.2006 09:16
Titel

Antworten mit Zitat Zum Seitenanfang
Hatte das Beispiel vor geraumer Zeit schonmal gepostet. Vielleicht hilft es auch Dir. Den Pfeil wirst so komplett los, den Rahmen kannst Du formatieren wie Du magst und die einzelnen Felder lassen sich browserabhängig stylen.
Ursprünglich hatte ich diese Methode entwickelt, um die Breite einer Selectbox unabhängig von der Länge der Auswahltexte unter Kontrolle zu behalten, ohne Javascript und dergleichen.

CSS
Code:
div#select {
   position: absolute;
   left: 50%;
   top: 50%;
   z-index: 20;
   width: 200px; /*Breite dem Layout anpassen*/
   height: 22px;
   margin-left: -100px;
   margin-top: -11px;
   overflow: hidden;
   color: inherit;
   background-color: transparent;
   border: 1px solid #FFCC00;
   }
select {
   position: relative;
   top: -1px;
   left: -1px;
   z-index: 10;
   width: 400px; /*Breite dem Text anpassen*/
   height: 25px;
   color: #333333;
   background-color: transparent;
   border: 1px solid #FFCC00; /*für Opera*/
   font-family: arial, sans-serif;
   font-size: 13px;
   }
option {
   border-left: 1px solid #FFCC00;
   border-right: 1px solid #FFCC00;
   }
.feld1 {
   color: #FFCC00;
   background-color: #FFFFFF;
   text-transform: uppercase;
   }
.feld2 {
   color: #FFFFFF;
   background-color: #FFCC00;
   }
.feld3 {
   color: #FFCC00;
   background-color: #FFFFFF;
   letter-spacing: 0.5em;
   }
.feld4 {
   color: #333333;
   background-color: #FFFFFF;
   text-transform: uppercase;
   font-weight: bold;
   }
.unten {
   border-bottom: 1px solid #FFCC00;
   }


HTML
Code:
<div id="select">
   <select name="custom-selectbox" size="1">   
   <option value="0" selected>:::::::::: Bitte w&auml;hlen Sie :::::::::: </option>   
   <option value="auswahl1" class="feld1">geht so</option>   
   <option value="auswahl2" class="feld2">suuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuper idee</option>
   <option value="auswahl3" class="feld3">alter hut</option>   
   <option value="auswahl4" class="feld4 unten">was soll das?</option>
   </select>
</div>


Zuletzt bearbeitet von sidisinsane am Do 11.05.2006 11:00, insgesamt 1-mal bearbeitet
  View user's profile Private Nachricht senden Website dieses Benutzers besuchen
 
Ähnliche Themen Nach Dropdown auswahl neues Dropdown erscheinen
Vista + IE 7: Input Felder
Felder ein-/ausblenden auf Mausklick
chkFormular mehrere Felder
SQL Datenbank Felder leeren
[mysql] einzelne Felder exportieren. wie?
Neues Thema eröffnen   Neue Antwort erstellen Seite: 1, 2  Weiter
MGi Foren-Übersicht -> Allgemeines - Nonprint


Du kannst keine Beiträge in dieses Forum schreiben.
Du kannst auf Beiträge in diesem Forum nicht antworten.
Du kannst an Umfragen in diesem Forum nicht mitmachen.

Mediengestalter.info ist ein Projekt von Webformatik :: Forensoftware: phpBB