|
|||
Dropdown Menu >>> iPad schließen
Ich habe den folgenden Code um mein Dropdown Menü zu öffnen.
<div class="navigation" onClick=""> <li class="button"><a href="index.html">Startseite</a></li> <li class="button"><a href="item1.html">Item1</a></li> </div> Dieses öffnet mein Menü im iPad auf einen "tap" (wie ein klick auf dem Desktopcomputer) durch onClick="". Es soll sich aber auch wieder schließen lassen, wenn ich erneut drauf tappe. Wie mache ich das? |
Sponsored Links |
|
|||
Es heißt onclick="" und nicht onClick="" ... Auch steht in deinem onclick nichts drinnen, also wird dort auch nichts ausgeführt. Du bindest die Funktion wohl dynamisch zu (was auch besser ist) . In dieser Funktion musst du nun die Logik einbauen, dass das Menü geschlossen wird, wenn es offen ist.
|
Sponsored Links |
|
|||
Hier der CSS Code dazu:
.navigation { background: #f6b678 url('images/link1.png') scroll; position: relative; z-index: 520; width: 200px; height: 200px; top: 142px; cursor: pointer; font-size: 0px; } .navigation ul ul {display:none;} .navigation ul li:hover > ul {display:block;} .navigation li.sub:hover ~ li.close {display:block;} .navigation:hover { background: #f6b678 url('images/link1_roll.png') scroll; } .navigation>li>a { visibility: none } .navigation:hover li a { position: relative; z-index: 520; display: block; background: rgba(220,220,220,0.; width: 410px; height: 15px; left: 200px; line-height: 15px; font-size: 13px; padding: 14px; border-top: 2px solid rgba(200,200,200,0.; border-left: 2px solid rgba(200,200,200,0.; border-right: 2px solid rgba(200,200,200,0.; border-bottom: 2px solid rgba(200,200,200,0.; } |
|
|||
Das ist ein CSS Code um per hover ein Menü zu öffnen. Da ist also auch nichts erkennbar, was durch ein Klicken ein Menü öffnet. Das wirst du auch mit reinem CSS nicht hinbekommen (oder nur schwer, so dass es auch wirklich gut funktioniert)
Dafür brauchst du ein JS, welches dir eine Klasse ändert. |
|
|||
Ich glaube ich habe dein Problem jetzt verstanden. Nicht nur das ipad, alle Smartphones/Tablets kennen keinen :hover zustand, diesen haben sie dann so eingebaut, dass es bei Klick ausgelöst wird. Du musst nur woanders hinklicken, dann wird das Menü wieder geschlossen. Das ist das Standardverhalten. Das onclick (welches du in deinem ersten Post erwähnt hast) macht gar nichts, weshalb ich zuerst verwirrt war.
Und ja, mit JS kennen sich hier einige aus. |
|
|||
Nein.
Edit: Mit :target kannst du es simulieren. |
Themen-Optionen | |
Ansicht | |
|
|
Ähnliche Themen | ||||
Thema | Autor | Forum | Antworten | Letzter Beitrag |
Problem mit PullDown Menu auf ipad/iphone | smisonline2 | CSS | 1 | 13.05.2013 17:13 |
Hilfe css Menu center | xXcyberXx | CSS | 5 | 28.11.2010 19:51 |
Linkverhalten im IE6 | ChOpSueY! | CSS | 19 | 19.05.2008 22:48 |
Drop Down Menu Positionsproblem | Schky | CSS | 4 | 21.04.2008 13:09 |
Problem mit vertikaler Navigation | Krissie | CSS | 0 | 15.08.2007 12:51 |