Ok ich hab es - hier steht die Lösung: https://css-tricks.com/forums/…-states-on-touch-devices/
Code
onclick = ""im div des Menüs und es geht 
Beiträge von Colin
-
-
Hallo zusammen,
auf einer Webseite habe ich ein Menü programmiert. Bei kleinem Display ist es ein Dropdown-Menü. Unter Android wie Windows geht es (öffnet sich bei Mouseover), unter iOS öffnet es sich bei Mouseover nicht. Versteht jemand, warum? Wo ist der Fehler?
HTML ist:
Code
Alles anzeigen<div class="navigation"> <div class="flex-navigation"> <div><img src="pics/logo_k.png" alt="Ferienwohnung 'Gute Laune'" height="40px"></div> <div class="big-screen"> <a class="textlink" href="index.html">HOME</a> | <a class="textlink" href="ausstattung.html">AUSSTATTUNG</a> | <a class="textlink" href="preise.html">PREISE</a> | <a class="textlink" href="kontakt.html">KONTAKT</a> </div> <div class="small-screen"><div id="menu"><ul><li> <h2 class="textlink">MENÜ</h2> <ul> <li><a class="textlink" style="background: #ffffff; display: block; width: 80px; border: 1px; padding: 2px;" href="index.html">HOME</a></li> <li><a class="textlink" style="background: #ffffff; display: block; width: 80px; border: 1px; padding: 2px;" href="ausstattung.html">AUSSTATTUNG</a></li> <li><a class="textlink" style="background: #ffffff; display: block; width: 80px; border: 1px; padding: 2px;" href="preise.html">PREISE</a></li> <li><a class="textlink" style="background: #ffffff; display: block; width: 80px; border: 1px; padding: 2px;" href="kontakt.html">KONTAKT</a></li> </ul> </li></ul></div> <div style="clear: both;"></div> </div> </div> </div>In der CSS-Datei habe ich hierfür:
Code
Alles anzeigen@media (max-width: 750px) { .big-screen { display: none; } } @media (min-width: 751px) { .small-screen { display: none; } } .navigation { position: fixed; font-size: 20px; top: 0; left: 0; right: 0; Background-color: #ffffff; opacity: 0.9; filter: alpha(opacity=90); } #menu { width: 100%; padding: 0 10px; background: none; font-size: 0.5em; line-height: 1.2; float: right; } #menu ul { float: left; width: 100px; list-style-type: none; background: #ffffff; } #menu li { position: relative; } #menu ul ul { position: absolute; z-index: 2; display: none; } #menu ul li:hover ul { display: block; } *html #body {behavior: url(csshover3-source.htc); font-size: 100%;} *html #menu ul li a {height: 1%;}Danke für eure Hilfe!!!
BG Colin