Selectbox/Dropdown ohne Pfeil
Sanjiro
- html
Hallo zusammen,
ich stehe vor einem kleinen Problemchen, wo ich nicht mehr weiter weiß.
Ich habe eine Tabelle, wo in jeder Zelle eine Selectbox mit der Weite 1 ist, damit sie ein Dropdownfeld wird. Da die Tabelle sehr breit ist brauche ich die Selectbox ohne den Dropdownpfeil. Denn mit dem Pfeil wird die Tabelle zu breit, so das man vertical scrollen muss. Das ist suboptimal.
Gibt es eine Möglichkeit den Pfeil irgendwie loszuwerden? Kann man das ganze irgendwie per CSS formatieren, oder anderweitig so eine Dropdownbox nachbauen?
Schonmal Danke.
Gruß,
Sanjiro
Hallo,
Gibt es eine Möglichkeit den Pfeil irgendwie loszuwerden? Kann man das ganze irgendwie per CSS formatieren, oder anderweitig so eine Dropdownbox nachbauen?
Per JS. Du hast einen Container in dem die "Einträge" als Links z.B. sind, und der wird bei bestimmten Events ein- oder ausgeblendet
mfg, Flo
Hallo Sanjiro,
Gibt es eine Möglichkeit den Pfeil irgendwie loszuwerden?
nein,
aber manche Designer begrenzen die DropDownBoxen. Von aussen sieht man nix,
und beim Aufklappen wird längerer Content einfach nicht angezeigt.
Wem das reicht kann mal nachsehen, bei den Namen fällt es besonders auf.
m.b.G. Rolf
Hallo,
Gibt es eine Möglichkeit den Pfeil irgendwie loszuwerden? Kann man das ganze irgendwie per CSS formatieren, oder anderweitig so eine Dropdownbox nachbauen?
na klar per css (is mir grade gekommen): clip!!
mfg, Flo
Hallo,
na klar per css (is mir grade gekommen): clip!!
Hallo,
hm, und wie mache ich das? Kenne mich mit CSS und z.B. overlayboxen nicht so wirklich aus. Ich kann per CSS Webseiten formatieren, aber für sowas reicht es im Moment leider noch nicht.
Kannst du mir da ein Beispiel nennen, wie das funktioniert?
Gruß,
Sanjiro
Hallo,
hm, und wie mache ich das? Kenne mich mit CSS und z.B. overlayboxen
Warum overlayboxen??
nicht so wirklich aus. Ich kann per CSS Webseiten formatieren, aber für sowas
Was ist sowas, wenn nicht Formatierung?
Kannst du mir da ein Beispiel nennen, wie das funktioniert?
ungetestet:
overflow: hidden;
position: absolute;
width: 120px;
clip: rect(0, 0, 100%, 100px);
bzw. im IE die kommata weglassen...
u.U. die 100% durch einen festen Pixelwert ersetzten (die Höhe)
mfg, Flo
Was ist sowas, wenn nicht Formatierung?
Hm ok, wenn ich deine Idee richtig verstanden habe ist es natürlich Formatierung. Ich habe bisher nur in eine andere Richtung gedacht, sprich so eine Dropdownbox nachbauen, deshalb die Overlayboxen. Sowas wäre auch ok. Sprich man klickt auf dein Eintrag in der Zelle und daneben öffnet sich bei eine Art Kontextmenü die Auswahlmöglichkeiten, welche man in die Zelle eingeben kann.
Wäre nett, aber keine Ahnung wie das umzusetzen wäre. Bin da nicht so firm drin.
ungetestet:
overflow: hidden;
position: absolute;
width: 120px;
clip: rect(0, 0, 100%, 100px);
Habe das mal grob ausprobiert, aber irgendwie steh entweder ich total aufm Schlauch, oder es funktioniert nicht.
Hab mal ein kleines Bildchen gebastelt, was das allgemeine Problem deutlich macht. Links die 3\*5 Zellen sind aus dem Firefox, so wäre es cool. Rechts die 3\*5 Zellen sind aus dem Internet Explorer und so nicht wirklich zu gebrauchen.

Ich könnte die Größe der Dropdownbox natürlich automatisch anpassen lassen, aber dann würde es mir die Breite der Tabelle sprengen. Sie passt so schon gerade noch, ohne das man scrollen muss.
Bin für Hilfe jeglicher Art dankbar.
Für deine bisherige Hilfe natürlich auch sehr, Flo.
Gruß,
Sanjiro
Arg, da ist das Bildchen doch irgendwie untergegangen.
Hier jetzt nochmal.
Hallo,
Wie genau hast du das jetzt umgesetzt?
Könntest du den Code vielleicht posten?
mfg, Flo
Hallo,
Wie genau hast du das jetzt umgesetzt?
Könntest du den Code vielleicht posten?mfg, Flo
Hallo Flo,
den Code kann ich dir im Laufe des Tages posten. Muss es erst nochmal in die Testanwendung einbauen. Im Moment ist er nicht mehr drin, da noch diverse andere Änderungen implementiert wurden.
Melde mich dann wieder.
mfg
Sanjiro
Hallo,
Wie genau hast du das jetzt umgesetzt?
Könntest du den Code vielleicht posten?mfg, Flo
Hallo Flo,
hier der Code:
Das steht in meiner CSS File:
select {
overflow: hidden;
position: absolute;
width: 120px;
clip: rect(0, 0, 100%, 100px);
}
Naja und die Selectbox ist eine normale unformartierte Selectbox, welche nur durch den obigen Code formatiert wird.
Hier noch nen Bild, wie die Sache dann aussieht. (Links Firefox, rechts IE).
Als letztes noch ein Bild, wie die Sache innerhalb der Tabelle dargestellt wird.
Suboptimal würde ich sagen. Aber kenne mich da auch nicht wirklich gut mit aus. Wie gesagt, einfache Formatierungen sind kein Ding, aber darüber hinaus fehlt das Wissen etwas ;)