iPad: „Link“-Hervorhebund für onclick deaktivieren?

[ratti]

Hallo,

Ich habe ein iPad-Spezifisches Problem: ein div hat per jquery einen onclick-Event bekommen, der ein javascript aufruft, welches grafisches Feedback gibt. Das funktioniert in allen Browsern, auch auf Safari-Desktop prima.

Das iPad macht an der Stelle einen grauen Kasten als optisches Feedback, der sich doch sehr mit *meinem* Feedback beisst (ich mache einen grünen kasten. )

Ich möchte diesen Kasten loswerden. Das sensitive Objekt ist ein DIV. Ausprobiert habe ich die Pseudoklassen active und focus:

In CSS:

.div_portfolio_over_text:focus  { 
	outline: 0px
	background-color:none;
}
.div_portfolio_over_text:active {
	border:0px solid black;
	outline:none;
	background-color:none;
}

In Javascript:

<div onfocus="this.blur()">

Aber das Luder will nicht weggehen. Noch jemand ´ne Idee?

Gruß,
Jörg

 

[simusch]

ich kann mir vorstellen, dass ein onFocus bei einem Div nicht erlaubt ist? Hast du das mal nachgeprüft... Evt. ist Safari im iOS hier stur.

 

[Zieger]

gibt es background-color:none; überhaupt?
probier mal background-color:transparent;

 

[ratti]

ich kann mir vorstellen, dass ein onFocus bei einem Div nicht erlaubt ist? Hast du das mal nachgeprüft... Evt. ist Safari im iOS hier stur.

Gut möglich. Letztlich bin ich darauf aber nicht festgelegt, die Frage ist ja, wie man es dann abstellt.

Es kann ja irgendwie nicht sein, dass sagenwirmal jemand ein JavaScript-Spiel programmiert, und jedesmal, wenn man auf „schiessen“ drückt, taucht erst mal ein dicker grauer Kasten auf… %-) …oder so…

Gruß,
Jörg

 

[ratti]

gibt es background-color:none; überhaupt?
probier mal background-color:transparent;

Du hast recht - leider hilft es nicht. Auch bei „blue“ wird es nicht blau, ergo: Falsche Richtung… Aber Danke!

Gruß,
Jörg

 

[pichfl]

Apple hat hierfür eine eigene CSS-Eigenschaft eingeführt. Die heißt

-webkit-tap-highlight-color

und unterstützt alle normalen Farbformate, also z.B.

-webkit-tap-highlight-color: #f00 /* Rot */

oder

-webkit-tap-highlight-color: rgba(0,255,0,0.5) /* Grün mit Transparenz */

Ob die Transparenz unterstützt wird weiß ich nicht, aber es wäre einen Versuch wert, rgba(0,0,0,0) (als 100% transparentes Schwarz) zu verwenden, oder einen Farbwert der deinem Hintergrund entspricht.

(via Safari Web Content Guide

 

[ratti]

Mensch, Super, das scheint es zu sein. Ich habe hier nur den Emulator aus Xcode, das war das eh nur schlecht zu sehen, aber es /scheint/ weg zu sein.

Witzig. Ich habe mich echt totgegoogelt und nix gefunden, wenn die Property dann kennt, findet sich auch massenhaft Material…

Für alle: Ich persönlich bin im überhaupt kein Freund von „browser-vorgegebenen Effekten“ und habe deswegen global zugeschlagen:

* {
	-webkit-tap-highlight-color: rgba(0,0,0,0);
}

Kann man bestimmt über Pseudoklassen sensibler handhaben, wenn man will.

Gruß,
Jörg