GoldenLine
Zaloguj się
Michał Zalewski

Michał Zalewski programista
aplikacji
internetowych

Temat: usuniecie przerywanej ramki wokol a:focus

Witam!
Szukalem rozwiazania prostego problemu: po kliknieciu na link (tekst/grafika) wokol niego pod FF i IE pojawia sie przerywana ramka.

W sieci znalazlem kilka propozycji, wg mnie najciekawsze to:
1. wykorzystanie zdarzenia onfocus
<a href="#" onfocus="blur()">label</a>, skuteczne, ale malo eleganckie,
2. wyciecie "ramek" w CSS
a:focus {
-moz-outline: none;
outline: none; /* CSS 3 */
ie-dummy: expression(this.hideFocus=true); /* IE >= 5.5 */
}

Mi bardziej podoba sie wersja z CSS, co sadzicie o takim rozwiazaniu?
Link do wypowiedziLink

konto usunięte

Temat: usuniecie przerywanej ramki wokol a:focus

Przy CSS należy pamiętać nie tylko o 'a:focus', lecz także o 'a:link, a:visited' - np:

a:link, a:visited {
text-decoration:underline;
color:#01647f;
outline:0;
}
a:hover {
text-decoration:none;
}
a:active{
color:#6c871d;
}
a:focus {
outline:none;
}Waldek Mazurek edytował(a) ten post dnia 13.04.07 o godzinie 15:28
Link do wypowiedziLink
Michał Zalewski

Michał Zalewski programista
aplikacji
internetowych

Temat: usuniecie przerywanej ramki wokol a:focus

Pamietam o a:active, a:link, itp. Mialem na mysli tylko efekt "ramki" przy kliknieciu na link.

outline:none; oficjalnie ma pelne wsparcie w CSS3, a przegladarki i ich obsluga CSS3 to temat na oddzielny watek.

Szukalem rozwiazania, ktore zadziala na wiekszosci przegladarek, takze tych starszych.
Link do wypowiedziLink

konto usunięte

Temat: usuniecie przerywanej ramki wokol a:focus

Nie wiem o co za bardzo chodzi (chyba jestem zbyt zmęczony), ale do usuwania rożnych efektownych "pierdół" itp polecam http://developer.yahoo.com/yui/
Link do wypowiedziLink

konto usunięte

Temat: usuniecie przerywanej ramki wokol a:focus

Nie ma to jak wytaczać ciężkie działa na walkę z muchą...
Link do wypowiedziLink
Michał Zalewski

Michał Zalewski programista
aplikacji
internetowych

Temat: usuniecie przerywanej ramki wokol a:focus

developer.yahoo.com/yui/
nie poszukuje rozwiazania - podalem je w pierwszym poscie.

chcialem tylko dowiedziec co inne osoby "siedzace" w CSS wybralyby, kombinowany CSS czy osadzenie w linku <a href="#" onfocus="blur()">.

osobiscie bardziej odpowiada mi rozwiazanie CSS. dlaczego? wrzucam raz w definicji styli i po problemie, moge wyciac globalnie lub narzucic na jakas klase styli.
Link do wypowiedziLink

konto usunięte

Temat: usuniecie przerywanej ramki wokol a:focus

a { outline:none }
a img { border:none }

?Daniel Fukuda edytował(a) ten post dnia 23.04.07 o godzinie 16:52
Link do wypowiedziLink
Michał Zalewski

Michał Zalewski programista
aplikacji
internetowych

Temat: usuniecie przerywanej ramki wokol a:focus

a { outline:none }
a img { border:none }

Musze przyznac, ze rozwiazanie daje te same efekty co moje i dziala poprawnie pod FF2, IE7 i O9. Chyba zbyt oczywiste, ale dziala wysmienicie (nie testowalem na starszych przegladarkach).
Dziekuje :)

Moze ktos wymysli cos rownie prostego?
Link do wypowiedziLink

konto usunięte

Temat: usuniecie przerywanej ramki wokol a:focus

Prościej i bardziej elegancko się już chyba nie da =)
Link do wypowiedziLink

konto usunięte

Temat: usuniecie przerywanej ramki wokol a:focus

Tak na marginesie, to warto pamiętać, że ta ramka jest potrzebna i w 99% przypadkach warto ją zostawić.

Zapewne o tym wiesz i akurat masz przypadek, kiedy możesz i masz racjonalny powód do usunięcia tej ramki, ale może ten wątek czyta też ktoś początkujący, więc piszę, żeby nagle odkrywszy outline nie zaczął stosować tego globalnie.
Link do wypowiedziLink

konto usunięte

Temat: usuniecie przerywanej ramki wokol a:focus

Do czego potrzebna?
Link do wypowiedziLink

konto usunięte

Temat: usuniecie przerywanej ramki wokol a:focus

np. do poruszania się po stronie za pomocą klawiatury.Dawid Lizak edytował(a) ten post dnia 13.05.07 o godzinie 11:05
Link do wypowiedziLink

konto usunięte

Temat: usuniecie przerywanej ramki wokol a:focus

Dawid L.:
np. do poruszania się po stronie za pomocą klawiatury.

No tak... zapomniałem :-)
Link do wypowiedziLink
Filip Łakomik

Filip Łakomik programista PHP,
LGBS Polska
Sp.z.o.o.

Temat: usuniecie przerywanej ramki wokol a:focus

Oba rozwiązania są OK :) myślę że nie ma co się specjalnie nad nimi rozczulać :)
onfocus='blur();' jest rzeczywiście mniej eleganckie, ale do pojedynczego linka obrazkowego nie zawahał bym się go użyć :) tym bardziej że CSS przejdzie walidację ;)
Drugie rozwiązanie jest wygodniejsze przy większej liczbie linków, za to CSS nie przechodzi walidacji, ale czy to taki problem??

a { outline:none }
a img { border:none }

skoro działa to jest najlepsze :)Filip Łakomik edytował(a) ten post dnia 04.05.09 o godzinie 15:11
Link do wypowiedziLink
Wojciech Gapiński

Wojciech Gapiński freelancer/PHP
developer/webmaster

Temat: usuniecie przerywanej ramki wokol a:focus

Wątek może nie najnowszy, ale tak tylko gwoli ścisłości:

a {outline: none}

jak najbardziej przechodzi walidację CSS.

Co nie zmienia faktu, że pozbywanie się tej ramki wszędzie i zawsze nie jest najlepszym pomysłem.Wojciech Gapiński edytował(a) ten post dnia 07.10.10 o godzinie 11:26
Link do wypowiedziLink
Ania Werner

Ania Werner Director, Make Your
Lamp

Temat: usuniecie przerywanej ramki wokol a:focus

Dziękuję Drodzy Koledzy,
pomogliście raczkującej (ba! raczkującej to aż nazbyt ambitnie powiedziane, otwierającej oczy dopiero! :-) )

Pozdrawiam, zostawiam ramki, i pamiętam też jak się ich pozbyć. Hurra!
Link do wypowiedziLink
« Wróć do tematów
Odpowiedz

Podobne tematy


Następna dyskusja:

CH Focus Park




Wyślij zaproszenie do
Anuluj