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: Nie każ szukać wyszukiwarki, czyli tworzenie wysuwanego panelu wyszukiwania w CSS3 i jQuery
https://webroad.pl/javascript/691-wysuwany-panel-css3-jquery
blog dla webmasterów, na którym piszemy o HTML5, CSS3, JavaScript, webdesign, UX, CMSSat, 26 Sep 2020 15:48:44 +0000
hourly
1 https://wordpress.org/?v=6.9.5
Autor: Damian
https://webroad.pl/javascript/691-wysuwany-panel-css3-jquery#comment-32
Wed, 26 Mar 2014 14:54:00 +0000https://webroad.pl/c7-zasoby/c39-javascript/691-wysuwany-panel-css3-jquery/#comment-32przycisk Zobacz DEMO on-line nie działa a w paczce z kodem źródłowym jest jakaś grafika
]]>
Autor: Michał Kortas
https://webroad.pl/javascript/691-wysuwany-panel-css3-jquery#comment-1
Tue, 18 Mar 2014 09:30:00 +0000https://webroad.pl/c7-zasoby/c39-javascript/691-wysuwany-panel-css3-jquery/#comment-1To tylko front panelu w HTML i CSS. Obsługę wyszukiwania musisz zapewnić sobie już sam.
]]>
Autor: Pawelelo520
https://webroad.pl/javascript/691-wysuwany-panel-css3-jquery#comment-1560
Thu, 13 Mar 2014 12:39:00 +0000https://webroad.pl/c7-zasoby/c39-javascript/691-wysuwany-panel-css3-jquery/#comment-1560Gdzie jest link do pliku w którym będzie wyszukiwany plik?
]]>
Autor: Michał Kortas
https://webroad.pl/javascript/691-wysuwany-panel-css3-jquery#comment-1116
Mon, 02 Sep 2013 16:12:00 +0000https://webroad.pl/c7-zasoby/c39-javascript/691-wysuwany-panel-css3-jquery/#comment-1116Uwzględniłem wszelkie wskazówki :) Dzięki!
]]>
Autor: Mr.Mr
https://webroad.pl/javascript/691-wysuwany-panel-css3-jquery#comment-1115
Mon, 02 Sep 2013 15:32:00 +0000https://webroad.pl/c7-zasoby/c39-javascript/691-wysuwany-panel-css3-jquery/#comment-1115Bardzo fajny efekt. Myślę, że po małych upgradach (tak jak sugerowano poniżej) będzie to znakomity dodatek do UI stron gdzie już jQuery jest wykorzystywana.
]]>
Autor: Michał Kortas
https://webroad.pl/javascript/691-wysuwany-panel-css3-jquery#comment-1113
Mon, 02 Sep 2013 12:06:00 +0000https://webroad.pl/c7-zasoby/c39-javascript/691-wysuwany-panel-css3-jquery/#comment-1113Spokojnie. Wiem do czego służy label :)
Z resztą zaraz po sugestii dodałem etykietę do kodu źródłowego.
Dziękuję za komentarz.
]]>
Autor: pomek
https://webroad.pl/javascript/691-wysuwany-panel-css3-jquery#comment-1112
Mon, 02 Sep 2013 12:00:00 +0000https://webroad.pl/c7-zasoby/c39-javascript/691-wysuwany-panel-css3-jquery/#comment-1112Dowiedz się do czego służy label, skoro twierdzisz, że „wedle uznania” można dodać. Label jest tak samo obowiązkowe dla input/select/textarea jak meta[charset] w head…
]]>
Autor: Michał Kortas
https://webroad.pl/javascript/691-wysuwany-panel-css3-jquery#comment-1111
Mon, 02 Sep 2013 11:48:00 +0000https://webroad.pl/c7-zasoby/c39-javascript/691-wysuwany-panel-css3-jquery/#comment-1111Dzięki za komentarz! Faktycznie, mogłem skorzystać z elementu „button”. Skorzystałem z jQuery, ponieważ na większości stron i tak ładujemy tę bibliotekę. Label oczywiście możemy musimy dodać (dziękuję za poprawkę, @pomek).
No i na sam koniec, zapomniałem wszystko opakować w „form”.
Pozdrawiam!
]]>
Autor: Comandeer
https://webroad.pl/javascript/691-wysuwany-panel-css3-jquery#comment-1110
Mon, 02 Sep 2013 11:42:00 +0000https://webroad.pl/c7-zasoby/c39-javascript/691-wysuwany-panel-css3-jquery/#comment-1110„Przycisk” – zatem niech to będzie *przycisk* a nie bezużyteczny link.
A co jeśli user nie ma JS (albo u niego nie działa)? Raczej szedłbym w kierunku :target z CSS3 i wgl wyeliminował JS. A jeśli już nie wyeliminował, to nie ciągnął jQuery tylko do zmiany klasy elementu. To nie jest aż tak skomplikowane do napisania w czystym JS (zwłaszcza w modern browserach, gdzie istnieje elem.classList).
Plus cały problem dostępności: pole wyszukiwania wręcz musi mieć label (placeholder go nie zastępuje – jeśli ktoś twierdzi inaczej, radzę poczytać speckę). Można go ukryć przed wizualnymi przy pomocy sztuczki z clip (patrz: klasa .visuallyhidden z H5BP). No i trochę mnie śmieszy ten przykład, gdzie formularz wyszukiwania jednak nie jest formularzem ;)
Natomiast wizualnie efekt jest bardzo dobry, choć bardzo przypomina natywną wyszukiwarkę przeglądarki (czy nie będzie to ciut mylące?)
]]>