zurück zur Startseite
  


Zurück XHTMLforum > (X)HTML und CSS > CSS
Seite neu laden gepunktete linie um geklickten button entfernen

Antwort
 
LinkBack Themen-Optionen Ansicht
  #1 (permalink)  
Alt 29.03.2008, 19:21
Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 06.03.2005
Beiträge: 68
schaf befindet sich auf einem aufstrebenden Ast
Standard gepunktete linie um geklickten button entfernen

Hallo!
Um den gepunkteten Rahmen, der im Firefox um einen angeklickten Link erscheint zu verhindern, gibt es ja outline:none;. Wenn ich allerdings einem button tag diese eigenschaft gebe, ändert sich nichts und die gepunktete Linie erscheint weiterhin wenn der button angeklickt wird. gibt es da irgendeinen Trick?
liebe grüße und danke im voraus
Florian
Mit Zitat antworten
Sponsored Links
  #2 (permalink)  
Alt 29.03.2008, 19:41
Standardkatze
XHTMLforum-Kenner
 
Registriert seit: 06.02.2007
Beiträge: 1.820
gato ist einfach richtig nettgato ist einfach richtig nettgato ist einfach richtig nettgato ist einfach richtig nettgato ist einfach richtig nett
Standard

outline zu verstecken ist die denkbar schlechteste Methode. Du zwingst damit all deine Besucher, ohne auszukommen. Dabei ist die Eigenschaft für Keyboard-Benutzer essentiell.

Wenn dir selbst die outline nicht gefällt, dann deaktiviere sie bitte auch nur für dich selbst. Das geht im Firefox ganz einfach mit der about:config-Variable browser.display.focus_ring_width. Setze sie auf 0 und du hast Ruhe.
__________________
Über Internet Explorer 8:
Noch bis 8. April 2014 wird der Internet Explorer 6 mit Sicherheitsupdates versorgt.
Bereits jetzt kann dieser Browser aber vollständig durch den IE8 ersetzt werden. Ältere Betriebssysteme und Browserversionen werden von Microsoft nicht mehr unterstützt.
Auch Programme, die den IE7 benötigen, sind kein Argument gegen IE8, da dieser über entsprechende Kompatibilitätsschichten verfügt.
Ab sofort gilt daher der Internet Explorer 8 als vorausgesetzer Mindeststandard.
Mit Zitat antworten
Sponsored Links
  #3 (permalink)  
Alt 29.03.2008, 23:33
Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 06.03.2005
Beiträge: 68
schaf befindet sich auf einem aufstrebenden Ast
Standard

Okay, danke, Ich muss zu meiner Schande gestehen, dass ich nicht wusste, dass das so wichtig ist.
Danke
Flo
Mit Zitat antworten
  #4 (permalink)  
Alt 29.03.2008, 23:35
Standardkatze
XHTMLforum-Kenner
 
Registriert seit: 06.02.2007
Beiträge: 1.820
gato ist einfach richtig nettgato ist einfach richtig nettgato ist einfach richtig nettgato ist einfach richtig nettgato ist einfach richtig nett
Standard

Unwissen kann nur kleiner werden
Mit Zitat antworten
  #5 (permalink)  
Alt 23.11.2008, 17:28
Benutzerbild von siteway.de
Siteway.de - Webdesigner
neuer user
 
Registriert seit: 23.11.2008
Ort: Hamburg
Beiträge: 14
siteway.de befindet sich auf einem aufstrebenden Ast
Standard

Alter Beitrag, aber bin über die Google Suche eingestiegen.
Habe das gleiche Problem wie *schaf*.

Lieber *gato* danke das Du in diesem Forum aktiv bist, aber ich ärgere mich immer tierisch über Forumseinträge in denen sinnvolle Fragen einfach so abgetan werden...

Sicherlich ist es nicht sinnvoll die css-outline einfach so ersatzlos zu disabeln, aber es gibt designtechnisch viel schönere Möglichkeiten, die ich ständig auf meinen Websites einsetzte (davon mal abgesehen, dass ich niemanden kenne, der tatsächlich die Tastatur zum Navigieren nutzt ... ich glaube das ist ein Mythos - aber im Zuge der Accessability sollte man das wohl beachten)

Also hier die Lösung für normale Links mit deaktivierter outline und entsprechendem (schönen) Ersatz für die Tab-Navigation:

css:
Code:
a {color: black; outline: none;}
a:hover, a:focus  {color: red;}
Ich weise also dem Zustand focus (der Eintritt wenn ich einen Link über die Tastatur (Tab) anspringe) das gleiche Layout zu, wie als wenn ich mit der Maus darauf zeige (hover). Das ist eigentlich sogar noch sinnvoller als eine gepunktete Linie ...

Dies kann natürlich mit css beliebig gestaltet werden! Mit Hintergrundbild, Farbe, Border usw. lässt sich hier alles machen.

Ein Problem bleibt:

Das von *schaf* beschriebene Problem bleibt aber bestehen, denn bei dem button-tag funktioniert dies nicht und die outline bleibt (Firefox)

gemeint ist dieser Tag:
Code:
<button>Formular abschicken</button>
Falls also irgendjemand eine Lösung dafür findet bitte hier veröffentlichen!
(weil man diesen Beitrag ja eh über Google schon findet)
Mit Zitat antworten
  #6 (permalink)  
Alt 23.11.2008, 22:05
Benutzerbild von Praktikant
Semantikbremse.
XHTMLforum-Kenner
 
Registriert seit: 22.04.2008
Beiträge: 4.985
Praktikant kann auf vieles stolz seinPraktikant kann auf vieles stolz seinPraktikant kann auf vieles stolz seinPraktikant kann auf vieles stolz seinPraktikant kann auf vieles stolz seinPraktikant kann auf vieles stolz seinPraktikant kann auf vieles stolz seinPraktikant kann auf vieles stolz seinPraktikant kann auf vieles stolz sein
Standard

Ich finde es auch nicht sinnvoll outline zu verstecken. Ich nutzte manchmal die Tastatur, wenn ich zum Beispiel zu faul bin nach der Maus zu greifen, oder wenn ich eh nur eine Hand freihabe weil ich telefoniere und dann ist der Weg einfach kürzer Da bin ich heilfroh, wenn zu der Farbänderung die der Autor für den Link vorgesehen hat noch die outline kommt. Man kann einfach den Link besser sehen.
Zudem.... klappt es danach wirklich noch, wenn man mit dem Keyboard navigieren will??
Kannst du und vielleicht mal ein Beispiel zeigen?
__________________
Rettet die Erde.... sie ist der einzige Planet mit Schokolade!
Mit Zitat antworten
  #7 (permalink)  
Alt 28.11.2008, 12:10
Benutzerbild von siteway.de
Siteway.de - Webdesigner
neuer user
 
Registriert seit: 23.11.2008
Ort: Hamburg
Beiträge: 14
siteway.de befindet sich auf einem aufstrebenden Ast
Standard

Ja, man muss sich eben bewusst sein, dass man dem User ein gewohntes Merkmal nimmt - aber ich bin der Auffassung, dass jemand der die Tab-Navigation kennt und nutzt eher in den Bereich der PC/Internet-affinen User gezählt werden kann und ihm wage ich es zuzumuten (da ich ja auch eine Alternative gebe, die so aussieht, als wenn er die Maus darüber bewegen würde und für mich daher sogar mehr Sinn macht als eine Outline).

Ein Beispiel für in etwa denselben Code wie oben beschrieben (zumindest gleiche Funktion) findest Du z.B.: hier: Home- Bühner Casting Hamburg
Mit Zitat antworten
  #8 (permalink)  
Alt 28.11.2008, 12:20
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 28.01.2005
Beiträge: 11.775
fricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz sein
Standard

Zitat:
Zitat von siteway.de Beitrag anzeigen
aber ich bin der Auffassung, dass jemand der die Tab-Navigation kennt und nutzt eher in den Bereich der PC/Internet-affinen User gezählt werden kann
Schon mal an Menschen gedacht, die keine Maus bedienen können, weil sie motorisch eingeschränkt sind?
Mit Zitat antworten
  #9 (permalink)  
Alt 28.11.2008, 12:29
{ display: random;}
XHTMLforum-Kenner
 
Registriert seit: 08.09.2004
Ort: Stuttgart
Beiträge: 5.034
andir ist ein wunderbarer Anblickandir ist ein wunderbarer Anblickandir ist ein wunderbarer Anblickandir ist ein wunderbarer Anblickandir ist ein wunderbarer Anblickandir ist ein wunderbarer Anblick
Standard

Zitat:
Zitat von fricca Beitrag anzeigen
Schon mal an Menschen gedacht, die keine Maus bedienen können, weil sie motorisch eingeschränkt sind?
Er wird es nun nicht mehr wagen zu behaupten...

Davon abgesehen wäre die gepunktete Linie hinfällig, wenn es eine andere eindeutige visuelle Rückmeldung für den Benutzer gibt: Farbwechsel, Grautonwechsel, Schriftänderung und dergleichen. Aber eben sichtbar und eindeutig muss sie sein. Das verlinkte Beispiel der Bühne wäre mir nicht eindeutig genug.

Aber Eindeutigkeit zu schaffen ist hier schwer: Die gepunktete Linie ist konventionell und daher nahezu jedem bekannt für einen aktiven Link. Eine (Farb-)änderung wird nur im Kontext zur Umgebung erfasst und könnte genausogut für die gerade besuchte Seite stehen.

Daher im Zweifel: Lassen.
__________________
Grüsse Andreas- auch mal wieder da...

Design isn't about the tools, it's about creating the best experience for the user. A design should be based on usability, accesibility, aesthetics, but never on floats, lists or background images. ( by Cameron Adams)
Wiedergelesen: > hier und hier

[Foren-Links] Dein Post? Klar, DAS vorher gelesen? Hilft. ## User-Landkarte
Mit Zitat antworten
Sponsored Links
  #10 (permalink)  
Alt 28.11.2008, 12:33
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 28.01.2005
Beiträge: 11.775
fricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz sein
Standard

Zitat:
Zitat von andir Beitrag anzeigen
Er wird es nun nicht mehr wagen zu behaupten...
Ja, manchmal hilft nur Provokation, um einen Tunnelblick zu erweitern.

Zitat:
Das verlinkte Beispiel der Bühne wäre mir nicht eindeutig genug.
Full ACK.
Mit Zitat antworten
Sponsored Links
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
css - Linie oben wird statt gepunktet gestrichelt dargestellt Agnes CSS 2 19.11.2007 16:58
Private Nachrichten (PN) Button entfernen? dexter Fragen, Konstruktive Kritik, Lob / Bekanntmachungen 9 24.07.2004 01:06


Alle Zeitangaben in WEZ +2. Es ist jetzt 13:54 Uhr.