JavaScript jquery $(...).on('tap', $(...).toggle()); auf dem iPhone

M.E.

Lt. Commander
Dabei seit
Jan. 2007
Beiträge
1.923
Hallo zusammen,

Ich habe hier ein CSS3 basiertes Popup (Tooltip), das leider nur auf dem iPhone nicht funktioniert.

Im CSS3 verwende ich
HTML:
.popup-menu:focus .popup-menu-content {
visibility: visible; 
}
Um das Popup sichtbar zu machen, wenn auf den Text geklickt oder getoucht wird. Das funktioniert auf allen Geraeten wunderbar, bis auf iOS und Safari.

Auf dem iPhone muss ich das also irgendwie anders loesen, da dort sonst bei einem Touch garnichts passiert.
Ich dachte da an jQuery mit on('tap' ...) :\
Code:
<script>$("#popup-link-123").on("tap", $("#popup-link-123").toggle(10));</script>
Jetzt muss ich im CSS display: none: setzten, weil toggle() soweit ich weiss diese Eigenschaft veraendert.

Jetzt tut sich zwar etwas auf dem iPhone bei einem Touch, aber es ist so gut wie nicht benutzbar. Das Popup flackert kurz auf und in den meisten Faellen klicke ich auch schon auf den Link der im Popup enthalten ist, bevor ich es ueberhaupt richtig sehen kann.

Ich habe versucht den Parameter von toggle(X) anzupassen, aber das hat keinen Effekt auf die Benutzbarkeit. Ausserdem habe ich es auch schon mit ontouch, ontouchmove und ontouchend versucht. Ohne Erfolg.

Wie macht man das nun also richtig? Kann ja eigentlich nicht so schwer sein :)

Danke fuer jeden Tipp.

MfG
 

failormooNN

Lieutenant
Dabei seit
März 2013
Beiträge
710
1. Lösungsansatz

Versuch mal dem zu klickendem Element ein leeres onclick="" zu geben.

2. Lösungsansatz

Füge im Head folgendes Script ein:
HTML:
<script>document.addEventListener("touchstart", function(){}, true);</script>
Im CSS folgenden Zeile:
HTML:
.popup-menu:hover, .popup-menu:active {
-webkit-user-select: none;
-webkit-touch-callout: none
}

Irgendwie so.

Dann sollte auch das funktionieren, geb Dir aber keine Garantie.

HTML:
.popup-menu:hover .popup-menu-content,
.popup-menu:active .popup-menu-content {
visibility: visible; 
}

Beste Grüsse
failor
 

Teisi

Lt. Junior Grade
Dabei seit
Okt. 2008
Beiträge
439
Zuletzt bearbeitet:
Top