•  03-07-2019
  •  | 
  •  

Frage

Gibt es eine Möglichkeit, den Pop-up-Titel auf den Links zu unterdrücken, aber sie immer noch auf der Seite zu halten für Sehbehinderte?

War es hilfreich?

Lösung

Das ist eine Funktion des Browsers den Link Titel zu interpretieren und ein Tooltip / Popup angezeigt werden soll. Es gibt keine Möglichkeit, sie zu unterdrücken. Ich habe versucht, (weil ein Kunde mag sie entweder gar nicht) und es gibt keinen Weg um sie herum.

Andere Tipps

Ich weiß, das gelöst wurde, aber ich fand auch diese Abhilfe: ausblenden nativen Tooltip mit jQuery

hatte ich dieses Problem mit einem Projekt, bei dem der Kunde seinen eigenen Tooltip wollte angezeigt werden (die mit CSS gemacht wurde), aber es wurde auch wegen des Browser-initiierten Tooltip zeigt auch, so zeigte es zweimal. Wir haben um diesen durch das ‚title‘ Attribut zu entfernen und stattdessen ‚Daten‘ mit dem Text in der CSS zu füllen.

Ich bin nicht sicher, was Sie meinen, wie sie auf der Seite für Sehbehinderte zu halten, da sie nur sichtbar im Quellcode sind?

Zum Beispiel:

<a href="link" title="something">Link title here</a>

würde den Link ‚Link-Titel hier‘ zeigt auf der Seite sowie die lästige Popup, wenn Sie darauf schweben.

<a href="link" data="something">Link title here</a>

würde den Link ‚Link-Titel hier‘ zeigen würde aber zeigt nicht die lästigen Popup auf Schweben, obwohl Sie immer noch den data Tag verwenden können zu verweisen, was Sie wollen dort setzen (in unserem Fall haben wir den Text für den Tooltip für die CSS verweisen).

Natürlich, wenn Sie den Titel-Tag entfernen vollständig das Problem behoben ist, aber Sie sagen, Sie dort zu halten, benötigen so dass diese meine Abhilfe ist, wie verwendet, vor.

Dies funktioniert in jQuery. 

var val;
$('[YOUR_SELECTOR]').hover(function() {
    val = $(this).attr('title');
    $(this).removeAttr('title');
  },function() {
    $(this).attr('title',val);
})

... es wäre vielleicht nicht ideal, aber man konnte immer versuchen, anstelle eines title Attribut im <a href>, ein <span> innerhalb der <a> tags: 

/* screen.css */

a   { }

a span.titleText {
    display: none;
    position: absolute;
    bottom: 1.2em;
    left: 0;
}

a:hover span.titleText,
a:active span.titleText,
a:focus span.titleText {
    display: block;
}

/* audio.css */

a span {
    display: inline; /* or whatever the relevant attribute would 
                        be in an audio stylesheet. */
}

<head>
    <link href="screen.css" type="text/css" rel="stylesheet" media="screen" />
    <link href="audio.css" type="text/css" rel="stylesheet" media="screen-reader, audio" />
</head>

<a href="http://some.url.com">
    <span class="titleText">This is the title</span>This is the link
</a>

Ich weiß nicht, jedoch nahe, es als eine besonders praktische Lösung. Und ich bin ziemlich sicher, würde es nicht bestätigen. Wenn ich JS weiß, dass ich etwas mehr bearbeitbar vorschlagen, aber auch dann überzeugt, ich bin nicht würde es funktionieren.

Links in meinem Browser nicht anzeigen Tool-Tipps, wie, dass, wenn sie ein title Attribut haben.

Wenn Sie möchten, können Sie verwenden, Grease diese laufen Bit von Javascript evey Seite, sie zu entfernen. 

var anchorTags;
anchorTags = document.getElementsByTagName("a");
for(var i = 0; i < anchorTags.length; i++) {
  anchorTags[i].removeAttribute("title");
}
Lizenziert unter: CC-BY-SA mit Zuschreibung
Nicht verbunden mit StackOverflow
scroll top