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
  #21 (permalink)  
Alt 29.11.2008, 21:17
EvT EvT ist offline
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 11.09.2006
Ort: Bad Wildungen
Beiträge: 2.220
EvT ist jedem bekanntEvT ist jedem bekanntEvT ist jedem bekanntEvT ist jedem bekanntEvT ist jedem bekanntEvT ist jedem bekannt
Standard

Javascript ist nicht nötig, spiel mal ein wenig mit moz-focus-inner herum, z. B.:

Code:
input[type="submit"]::-moz-focus-inner {border: none;}
Sinnvoll? Opera visualisiert das Klicken eines Buttons mit einem 3D-Effekt, der dem User anzeigt, dass etwas passiert. Firefox macht das wohl über den gepunkteten outline-Rahmen. Nehme ich ihn diesen Effekt weg, kann es z. B. bei lahmen Server-Verbindungen vorkommen, dass der User zig Male auf den Button klickt, weil ihm nicht mehr angezeigt wird, dass die Aktion ausgeführt wird.
Mit Zitat antworten
Sponsored Links
  #22 (permalink)  
Alt 29.11.2008, 23:45
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

Zitat:
Zitat von EvT Beitrag anzeigen
Javascript ist nicht nötig, spiel mal ein wenig mit moz-focus-inner herum
Lieber EvT - ja, moz-focus-inner hab ich auch schon entdeckt ...
Es geht aber nicht um einen input-Tag oder a-Tag SONDERN um einen BUTTON-Tag! Und um es ganz klar zu stellen, damit ist nicht ein input-Button gemeint sondern ein Button-Button!

Code:
gemeint ist exakt
dieser Code : <button type="submit">Formular abschicken</button>
und nicht:     <input type="submit" value="formular abschicken" />
Bei einem Button-Tag funktioniert leider auch moz-focus-inner nicht... Bei einem Input-Tag funktioniert übrigenz auch einfach "outline: none"!
__________________
"Perfektion ist nicht dann erreicht, wenn es nichts mehr hinzu zu fügen gibt, sondern wenn man nichts mehr weglassen kann." - Antoine de Saint-Exupéry

Web: Webdesign in Hamburg
Mit Zitat antworten
Sponsored Links
  #23 (permalink)  
Alt 30.11.2008, 00:00
EvT EvT ist offline
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 11.09.2006
Ort: Bad Wildungen
Beiträge: 2.220
EvT ist jedem bekanntEvT ist jedem bekanntEvT ist jedem bekanntEvT ist jedem bekanntEvT ist jedem bekanntEvT ist jedem bekannt
Standard

Code:
*:focus {outline: none;}
*::-moz-focus-inner {border: none;}
Unter Vorbehalt, da ich es gerade nicht selbst testen kann.
Mit Zitat antworten
  #24 (permalink)  
Alt 30.11.2008, 13:44
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! Korrekt. So klappt es im Firefox zumindest schon ohne JavaScript:

Code:
button::-moz-focus-inner {border: none;}
Jippieeh.

Hatte gerstern versehentlich statt "border: none" mit "outline: none" getestet und das klappte dann natürlich nicht.

Nun muss nur noch eine eindeutige Markierung als Alternative für die Outline her, der Einfachheit zu Liebe als Beispiel:

Code:
button::-moz-focus-inner {border: none;}
button:hover {outline: none; color: red; text-decoration: underline;}
Das "outline: none" lasse ich beim Hover einfach mal drin ... aus Sturheit!
__________________
"Perfektion ist nicht dann erreicht, wenn es nichts mehr hinzu zu fügen gibt, sondern wenn man nichts mehr weglassen kann." - Antoine de Saint-Exupéry

Web: Webdesign in Hamburg
Mit Zitat antworten
  #25 (permalink)  
Alt 30.11.2008, 14:00
Standardkatze
XHTMLforum-Kenner
 
Registriert seit: 06.02.2007
Beiträge: 1.821
gato ist einfach richtig nettgato ist einfach richtig nettgato ist einfach richtig nettgato ist einfach richtig nettgato ist einfach richtig nett
Standard

Ich glaub ich hab nicht ganz durchschaut, warum ihr hier streitet.

Was ist denn so schlimm an der von mir genannten Methode:

Zitat:
Zitat von gato Beitrag anzeigen
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.
Löst das Problem für euch (auch bei button-Elementen) und beeinträchtigt keine anderen Benutzer.

Ach ja: Dass die gepunktete Linie im Firefox immer angezeigt wird und nicht nur, wenn man mit der Tastatur navigiert ist ein bekannter und langlebiger Fehler. Da sich das ganze in den letzten Versionen verschlimmert hat, gibts evtl. ne Chance, dass es für Fx3.2 behoben wird.
__________________
Ü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.

Geändert von gato (30.11.2008 um 14:03 Uhr)
Mit Zitat antworten
  #26 (permalink)  
Alt 30.11.2008, 15:58
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

Hi gato, von einem Problem würde ich nicht sprechen...
Es geht mir jedoch nicht darum meinen eigenen PC (Software) zu tunen, sondern darum das Layout einer Website zu steuern - und ich sehe keinen Grund warum die Outline bei Links und Buttons das einzige Element innerhalb des Layouts sein soll auf das ich keinen Einfluss nehmen kann.

Die Usability einer Website wird ganz sicher nicht nur von dieser verflixten Outline bestimmt...

Es wird ja nicht die Denkmaschine komplett runtergefahren nur weil die Outline deaktiviert wird. Es gibt auch andere Möglichkeiten eine Steuerung über die Tastatur zu ermöglichen (die im Übrigen in diesem Beitrag zur Genüge und mehrmals behandelt wurden). Das Web ist zu vielseitig als dass man verallgemeinern könnte: die OUTLINE DARF NICHT DAKTIVIERT WERDEN...

... ... ...

Es gibt doch sicherlich auch noch einen CSS-Hack oder CSS-MS-Filter, der die Outline bei beim Button-Tag im Internet Explorer deaktiviert... Wenn wir den auch noch finden können, wäre das doch superklasse!
__________________
"Perfektion ist nicht dann erreicht, wenn es nichts mehr hinzu zu fügen gibt, sondern wenn man nichts mehr weglassen kann." - Antoine de Saint-Exupéry

Web: Webdesign in Hamburg

Geändert von siteway.de (30.11.2008 um 16:01 Uhr)
Mit Zitat antworten
  #27 (permalink)  
Alt 30.11.2008, 16:03
Standardkatze
XHTMLforum-Kenner
 
Registriert seit: 06.02.2007
Beiträge: 1.821
gato ist einfach richtig nettgato ist einfach richtig nettgato ist einfach richtig nettgato ist einfach richtig nettgato ist einfach richtig nett
Standard

Mh, verstehe. Aber wie gesagt, dass die Linie im Mozilla überhaupt angezeigt wird, ist ja ein Fehler und kein Feature (zumindest in der aktuellen Darstellung).

Andererseits style ich meine Formularelemente gar nicht, von daher kann ich da wohl nicht wirklich mitreden^^
Mit Zitat antworten
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 15:58
Private Nachrichten (PN) Button entfernen? dexter Fragen, Konstruktive Kritik, Lob / Bekanntmachungen 9 24.07.2004 00:06


Alle Zeitangaben in WEZ +2. Es ist jetzt 02:00 Uhr.