Code ist eigentlich nur dieser:
<div class="icon-filter" onclick="selectFunction()">
</div>Dieses div ist 1 x 1 rem und eine kleine klickbare Grafik. Wenn diese jedoch klickt, blinkt dieser kleine vertikale Textpositionsanzeiger in der Grafik.
Eine andere Frage, ich habe es mit der Grafik mittlerweile geschafft. Jetzt ist das Problem, wenn ich daraufklicke, dann blinkt der kleine vertikale Strich,
der anzeigt an welcher Stelle im Text man sich befindet. Da dort aber nur eine Grafik ist, blinkt dieser hässliche Strich auf der Grafik.
Kann man das irgendwie unterbinden?
Ok danke.
Ich werde wahrscheinlich ein irgendwas aus allem zusammenbasteln, auch mit Hilfe der Links, bis das Ergebnis stimmt 
Ich wünsche noch ein schönes WE.
Ich habe mich glaube nicht verständlich ausgedrückt.
Wie in meinem Beispiel habe ich eine Grafik, wenn ich auf diese klicke dropt ein Container auf, in diesem ist dann ein weiteres Select-Menü
das ich dann öffnen kann und etwas auswählen kann.
Ich möchte aber nicht die Verschachtelung, sondern dass direkt die Options angezeigt werden.
Kurz gesagt ein ganz normales Select/Option Menü, aber ohne Text im Default Zustand. Also man sieht nur eine kleine Grafik, auf die kann man klicken
und dann öffnet sich das Options Menü.
Ich habe jetzt für mich diese Lösung gefunden, bin aber nicht ganz zufrieden damit:
<div class="dropdown">
<div class="icon-filter" onclick="selectFunction()">
</div>
</div>
<div class="dropdown-content" id="myDropdown">
<div class="button-select-menue">
<button type="submit" name="filter-select" value="test" class="select-button">Option 1</button>
</div>
<div class="button-select-menue">
<button type="submit" name="filter-select" value="test" class="select-button">Option 2</button>
</div>
<div class="button-select-menue">
<button type="submit" name="filter-select" value="test" class="select-button">Option 3</button>
</div>
</div>Funktioniert jetzt so, ganz ohne Select Menü. Ist die einzige Lösung wie ich es geschafft habe nur eine Grafik als Drop-Button zu haben.
Bei klick auf den div "icon-filter" dropt der div "dropdown-content", darin habe ich frei gestaltbare divs und Buttons, die bei klick das umschließende Formular absenden und eine Variable mitgeben.
Aber es muss doch auch möglich sein, ein Select Menü mit NUR einer Grafik zu öffnen?
Ich habe schon eine mögliche bzw. mir die liebste Variante gefunden.
Z.B. hier einmal das schlichte Select Menü:
<div class="drop-filter">
<button onclick="drop_func()" class="drop-icon">Filter-Grafik</button>
<div id="dropdown" class="selections">
<select>
<option value="1">Pure CSS Select</option>
<option value="2">No JS</option>
<option value="3">Nice!</option>
</select>
</div>
</div>Es gibt entsprechend etwas Java dazu, dass mit klick auf eine "Filter-Grafik" der div-Container "dropdown" gedroppt wird.
In diesem ist jetzt natürlich das Select Menü. Ich weiß nicht genau, wie ich in diesem Dropdown einfach Optionen anzeigen
lassen kann, die selektiert und dann mit dem Formular übergeben werden können.
Hallo zusammen,
ich möchte ein Select Menü gestalten mit mehreren Optionen.
Eigentlich ganz simpel, ich möchte statt den Text auf den man klickt und das Auswahl Menü öffnet,
nur eine Grafik auf die man klickt.
Also ich habe eine kleine Grafik (z.B. ein Symbol für Filter), wenn man darauf klickt öffnet das Menü
mit der entsprechenden Auswahl. Hat man ausgewählt, verschwindet die Auswahl wieder und bleibt
ganz normal im Hintergrund für das Formular selektiert.
Kann mir dabei jemand helfen?
Liebe Grüße
Tobi
Damit kann ich schon was anfangen und werde es mal auseinanderbasteln und versuchen anzupassen.
Was mir auffällt, dass der Balken am Ende immer auf die 100% springt, auch wenn z.B. 80% angegeben sind.
Danke dafür.
Ich kann dann auch gerne das Ergebnis zeigen.
Eine andere Frage, gibt es ein Portal o.Ä. wo man verschiedenste Code-Schnipsel mit Beispielen finden kann?
Hallo zusammen,
ich möchte gerne eine div Box animieren und komme nicht ganz zurecht.
Es ist eigentlich ziemlich simpel, ich habe folgende Box:
<div id="animiert" style="width:80%"></div>
#animiert {
margin: 1rem;
height: 2rem;
background: #004402;
}Der Wert "width" im div-Tag ist variabel und wird aus einer Datenbank ausgelesen.
Jetzt möchte ich, dass dieser "Balken" sobald die Seite, oder die div-Box angezeigt wird, von links nach rechts "vollläuft" auf die 80% an Breite.
Kann mir dabei jemand helfen?
Liebe Grüße
Toeb