Warning: Redis::get(): php_network_getaddresses: getaddrinfo for localhost failed: No address associated with hostname in /home/klient.dhosting.pl/michalko/webroad.pl/public_html/wp-content/plugins/litespeed-cache/src/object-cache.cls.php on line 665

Warning: Cannot modify header information - headers already sent by (output started at /home/klient.dhosting.pl/michalko/webroad.pl/public_html/wp-content/plugins/litespeed-cache/src/object-cache.cls.php:665) in /home/klient.dhosting.pl/michalko/webroad.pl/public_html/wp-content/plugins/dw-question-answer/inc/Posts/Base.php on line 20

Warning: Cannot modify header information - headers already sent by (output started at /home/klient.dhosting.pl/michalko/webroad.pl/public_html/wp-content/plugins/litespeed-cache/src/object-cache.cls.php:665) in /home/klient.dhosting.pl/michalko/webroad.pl/public_html/wp-includes/feed-rss2-comments.php on line 8
Komentarze do: Animowane okienko nowości w CSS3 https://webroad.pl/html5-css3/757-animowane-okienko-nowosci-w-css3 blog dla webmasterów, na którym piszemy o HTML5, CSS3, JavaScript, webdesign, UX, CMS Sat, 26 Sep 2020 15:48:43 +0000 hourly 1 https://wordpress.org/?v=6.9.7 Autor: Comandeer https://webroad.pl/html5-css3/757-animowane-okienko-nowosci-w-css3#comment-1438 Mon, 06 Jan 2014 19:54:00 +0000 https://webroad.pl/c7-zasoby/c36-html-css/757-animowane-okienko-nowosci-w-css3/#comment-1438 Ok, w przypadku menu coś takiego działa. ale tutaj mówimy o nieinteraktywnym elemencie, który de facto nie robi nic, więc jego dostępność z klawiatury jest kwestionalna. dla AT treść i tak będzie dostępna (bo nie jest ukryta) a każdy normalny user ma myszkę (pomijając mobilne).
taki kafelek bez linka jest po prostu kaleki, dlatego też po prostu [tabindex=0] jest tutaj IMO strzałem w kolano

]]>
Autor: Michał Załęcki https://webroad.pl/html5-css3/757-animowane-okienko-nowosci-w-css3#comment-1437 Mon, 06 Jan 2014 19:45:00 +0000 https://webroad.pl/c7-zasoby/c36-html-css/757-animowane-okienko-nowosci-w-css3/#comment-1437 tabindex=”0″ jest bardzo przydatny, właśnie w kontekście dostępności, za przykład może posłużyć menu: https://github.com/MichalRazorZalecki/responsive-navigation.

Nie przypominam sobie, żebym gdziekolwiek pisał o onClick do przekierowywania.

]]>
Autor: Comandeer https://webroad.pl/html5-css3/757-animowane-okienko-nowosci-w-css3#comment-1436 Mon, 06 Jan 2014 17:34:00 +0000 https://webroad.pl/c7-zasoby/c36-html-css/757-animowane-okienko-nowosci-w-css3/#comment-1436 tak, i później widzę span[tabindex=0] z dorobionym onclickiem do odpalenia linku… nie, dzięki ;)
tabindex to ostateczny hack, gdzie już naprawdę nie można dać ani linku, ani buttona (wówczas i tak należy pamiętać o ARIA i atrybucie role) – czyli prawdę powiedziawszy jakiś promil procenta przypadków
btw proponuję opornym odtworzenie PEŁNEGO zachowania linku na span z użyciem HTML, ARIA, JS i CSS. życzę powodzenia ;)

]]>
Autor: Michał Kortas https://webroad.pl/html5-css3/757-animowane-okienko-nowosci-w-css3#comment-1434 Sun, 05 Jan 2014 18:40:00 +0000 https://webroad.pl/c7-zasoby/c36-html-css/757-animowane-okienko-nowosci-w-css3/#comment-1434 Zajmę się rozruszaniem tej kategorii. Dzięki za komentarz

]]>
Autor: Dawid https://webroad.pl/html5-css3/757-animowane-okienko-nowosci-w-css3#comment-1433 Sun, 05 Jan 2014 17:51:00 +0000 https://webroad.pl/c7-zasoby/c36-html-css/757-animowane-okienko-nowosci-w-css3/#comment-1433 Ostatnio zdecydowanie zabrakło tutaj artykułów dotyczących CSS3… Mam nadzieję, że będą się pojawiały regularniej :)

]]>
Autor: Michał Kortas https://webroad.pl/html5-css3/757-animowane-okienko-nowosci-w-css3#comment-1432 Sun, 05 Jan 2014 16:28:00 +0000 https://webroad.pl/c7-zasoby/c36-html-css/757-animowane-okienko-nowosci-w-css3/#comment-1432 Tak, ale nie ma co komplikować, bo okienko i tak będziemy musieli prędzej czy później podlinkować. A to załatwi nam też brak focusowania.

]]>
Autor: Michał Załęcki https://webroad.pl/html5-css3/757-animowane-okienko-nowosci-w-css3#comment-1431 Sun, 05 Jan 2014 16:23:00 +0000 https://webroad.pl/c7-zasoby/c36-html-css/757-animowane-okienko-nowosci-w-css3/#comment-1431 Zawsze można dodać po prostu tabindex=”0″.

]]>
Autor: Michał Kortas https://webroad.pl/html5-css3/757-animowane-okienko-nowosci-w-css3#comment-1430 Sun, 05 Jan 2014 16:20:00 +0000 https://webroad.pl/c7-zasoby/c36-html-css/757-animowane-okienko-nowosci-w-css3/#comment-1430 No właśnie zauważyłem, że focus nie działa już po publikacji :P
Zamiast .news dam link, to też rozwiąże „problem”, o którym wspomnieliśmy niżej.
Dzięki!

]]>
Autor: Comandeer https://webroad.pl/html5-css3/757-animowane-okienko-nowosci-w-css3#comment-1429 Sun, 05 Jan 2014 16:14:00 +0000 https://webroad.pl/c7-zasoby/c36-html-css/757-animowane-okienko-nowosci-w-css3/#comment-1429 bardzo dobrze, że są style dla :focus. bardzo źle, że te elementy są niefocusowalne ;) w tym wypadku zastanowiłbym się czy z .news po prostu nie zrobić linka. IMO będzie to najprostsze rozwiązanie

]]>
Autor: Michał Kortas https://webroad.pl/html5-css3/757-animowane-okienko-nowosci-w-css3#comment-1428 Sun, 05 Jan 2014 14:28:00 +0000 https://webroad.pl/c7-zasoby/c36-html-css/757-animowane-okienko-nowosci-w-css3/#comment-1428 Dzięki, poprawię to. Faktycznie mogłem od razu podlinkować, choć w zamyśle miałem tylko pokazać, jak stworzyć sam efekt.

]]>
Autor: Mr.Mr https://webroad.pl/html5-css3/757-animowane-okienko-nowosci-w-css3#comment-1426 Sun, 05 Jan 2014 13:07:00 +0000 https://webroad.pl/c7-zasoby/c36-html-css/757-animowane-okienko-nowosci-w-css3/#comment-1426 IMO dobrze by było gdyby gdzieś w html’u zmieścić jeszcze link tak żeby dało się kliknąć w całe okienko i żeby mogło działać jako taki duży link. Ewentualnie dałbym jakiś guzik lub link tekstowy.
Jeśli to pierwsze rozwiązanie to przydałoby się też dodać cursor:pointer żeby było wryaźnie widać, że da się w to kliknąć.

]]>