zurück zur Startseite
  


Zurück XHTMLforum > (X)HTML und CSS > (X)HTML
Seite neu laden Dropdown Menu >>> iPad schließen

Antwort
 
LinkBack Themen-Optionen Ansicht
  #1 (permalink)  
Alt 06.04.2015, 14:39
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 13.03.2015
Beiträge: 9
BR1977 befindet sich auf einem aufstrebenden Ast
Standard 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?
Mit Zitat antworten
Sponsored Links
  #2 (permalink)  
Alt 07.04.2015, 10:21
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 30.01.2014
Beiträge: 2.247
cloned ist ein wunderbarer Anblickcloned ist ein wunderbarer Anblickcloned ist ein wunderbarer Anblickcloned ist ein wunderbarer Anblickcloned ist ein wunderbarer Anblickcloned ist ein wunderbarer Anblickcloned ist ein wunderbarer Anblick
Standard

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.
Mit Zitat antworten
Sponsored Links
  #3 (permalink)  
Alt 09.04.2015, 10:59
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 13.03.2015
Beiträge: 9
BR1977 befindet sich auf einem aufstrebenden Ast
Standard

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.;
}
Mit Zitat antworten
  #4 (permalink)  
Alt 09.04.2015, 11:06
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 30.01.2014
Beiträge: 2.247
cloned ist ein wunderbarer Anblickcloned ist ein wunderbarer Anblickcloned ist ein wunderbarer Anblickcloned ist ein wunderbarer Anblickcloned ist ein wunderbarer Anblickcloned ist ein wunderbarer Anblickcloned ist ein wunderbarer Anblick
Standard

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.
Mit Zitat antworten
  #5 (permalink)  
Alt 09.04.2015, 11:17
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 13.03.2015
Beiträge: 9
BR1977 befindet sich auf einem aufstrebenden Ast
Standard

ich kenne mich mit JS nicht aus, weißt du wie man so ein JS script schreibt?
Mit Zitat antworten
  #6 (permalink)  
Alt 09.04.2015, 11:26
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 30.01.2014
Beiträge: 2.247
cloned ist ein wunderbarer Anblickcloned ist ein wunderbarer Anblickcloned ist ein wunderbarer Anblickcloned ist ein wunderbarer Anblickcloned ist ein wunderbarer Anblickcloned ist ein wunderbarer Anblickcloned ist ein wunderbarer Anblick
Standard

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.
Mit Zitat antworten
  #7 (permalink)  
Alt 09.04.2015, 12:15
Neuer Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 13.03.2015
Beiträge: 9
BR1977 befindet sich auf einem aufstrebenden Ast
Standard

kennt CSS3 nicht so etwas wie eine :click Klasse?
Mit Zitat antworten
  #8 (permalink)  
Alt 09.04.2015, 12:17
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 30.01.2014
Beiträge: 2.247
cloned ist ein wunderbarer Anblickcloned ist ein wunderbarer Anblickcloned ist ein wunderbarer Anblickcloned ist ein wunderbarer Anblickcloned ist ein wunderbarer Anblickcloned ist ein wunderbarer Anblickcloned ist ein wunderbarer Anblick
Standard

Nein.
Edit: Mit :target kannst du es simulieren.
Mit Zitat antworten
Antwort

Themen-Optionen
Ansicht

Forumregeln
Es ist Ihnen nicht erlaubt, neue Themen zu verfassen.
Es ist Ihnen nicht erlaubt, auf Beiträge zu antworten.
Es ist Ihnen nicht erlaubt, Anhänge hochzuladen.
Es ist Ihnen nicht erlaubt, Ihre Beiträge zu bearbeiten.

BB-Code ist an.
Smileys sind an.
[IMG] Code ist an.
HTML-Code ist aus.
Trackbacks are an
Pingbacks are an
Refbacks are aus


Ähnliche Themen
Thema Autor Forum Antworten Letzter Beitrag
Problem mit PullDown Menu auf ipad/iphone smisonline2 CSS 1 13.05.2013 18:13
Hilfe css Menu center xXcyberXx CSS 5 28.11.2010 20:51
Linkverhalten im IE6 ChOpSueY! CSS 19 19.05.2008 23:48
Drop Down Menu Positionsproblem Schky CSS 4 21.04.2008 14:09
Problem mit vertikaler Navigation Krissie CSS 0 15.08.2007 13:51


Alle Zeitangaben in WEZ +2. Es ist jetzt 14:05 Uhr.