Webkit pozwala kolorować scrollbary

Właśnie przeczytałem szokującą wiadomość - silnik Webkit dorobił się możliwości modyfikowania wyglądu pasków przewijania w elementach, polach tekstowych (textarea) i listach (select). Co więcej, w odróżnieniu od Internet Explorera, można nie tylko zmieniać kolor paska, ale nawet regulować jego szerokość (wysokość) i zastępować jego części plikami graficznymi. Odpowiednie deklaracje można - z użyciem odpowiednich pseudo-elementów i pseudo-klas, definiować dla wybranych obszarów scrollbara i dla wybranych stanów, np. dla aktywnego i nieaktywnego okna.

Dla posiadaczy odpowiedniego builda przygotowano demo, zaś dla reszty pozostaje notka na blogu, na której można zapoznać się ze składnią i możliwościami.


Kategorie: Webkit 20 marca 2009, 00:04:17 22 komentarze

Komentarze dla notki “Webkit pozwala kolorować scrollbary”

  1. lukasz - 20 marca 2009, 01:34:02

    O to świetnie, teraz tylko trzeba poczekać na odzew ze strony Fx i Opery i mamy z głowy problem z wymuszaniem natywności u grafików ;)

  2. wikiyu - 20 marca 2009, 12:57:43

    Lukasz – nie wiem czy świetnie.. każda przeglądarka jak zwykle będzie to robić inaczej i coś co było „normalne” i OOTB natywne i pasujące do systemu [wszak po coś niektórzy ludzie personalizują system] teraz będzie zupełnie nieprzystosowane…

    Zwłaszcza skrajne paski okna przeglądarki będą razić po oczach gdy np mamy białą stronę, zielone czy różowe paski i dalej mhroczny czarny system jaki lubimy…

  3. lukasz - 20 marca 2009, 13:03:21

    Dlatego sporo czasu upłynie zanim będzie to poprawnym standardem, Razić po oczach? Skoro mamy styl systemu ustawiony na jakiś czarny, to oczywiste jest że większość stron Nas razi bo jest biała. Zmiana scrolla w polu textera aby pasował do reszty strony będzie raczej miłym dodatkiem, obojętnie w jakiej wersji kolorystycznej ona będzie.

  4. wikiyu - 20 marca 2009, 13:10:26

    Lukasz – problem jest jeszcze w czymś – teraz wiem czego szukać przy takim textarea czy object`cie lub iframe`ie bo paski są zawsze takie same, a jak będzie można zmienić ich rozmiar i wygląd włącznie z własnymi grafikami jak w webkicie… to ja dziękuję. ten zrobi olbrzymie, a inny tak małe że ledwo da się kliknąć przy wysokiej rozdzielczości na np 21 calowym ekranie.

  5. lukasz - 20 marca 2009, 13:13:19

    I właśnie od takich spraw powinna być opcja trybu autorskiego użytkownika przeglądarki który wyłączy takie dodatkowe bajery graficzne. Z tym akurat nie widzę problemu. Wszytko zależy od zdolności artystycznych grafika i kodera.

  6. Michał Górny - 20 marca 2009, 14:08:48

    Taa, był sobie w Internecie idiotyczny badziew, przez chwilę sobie pożył, wszyscy do niego fapowali. Potem sobie szczęśliwie (dla rozsądnych ludzi) umarł, długo cisza — i tu nagle „finkdyfrenty” próbują go ożywić. Może za tydzień zmienią zachowanie float na zgodne z IE (wzorem mozilli)?

  7. lukasz - 20 marca 2009, 14:11:11

    A co Ci nie pasuje w zachowaniu float? Poza tym porównaniu tego co było do tego co jest teraz…

  8. Paweł Ciupak - 20 marca 2009, 14:16:35

    Ekstra. Czekam teraz na WebShitowe implementacje <blink /> i <marquee />.

  9. Wasacz - 20 marca 2009, 15:34:05

    lukasz: Michał ma na myśli totalnie skopany float w Gecko, w dodatku naśladujący zachowanie IE (a czy to celowe – nie wiem).

    Myślałem, że kolorowanie scrollbarów wymarło, może chociaż będzie możliwość wyłączenia tego, jak jest na przykład w Operze. Swoją drogą, Firefox koloruje paski przewijania?

    Ech, a w CSS3 jest też obrzydliwe ::selection ;/

  10. Michał Górny - 20 marca 2009, 17:09:08

    lukasz: Mniej więcej to, że żeby A było na prawo od B, to w kodzie musi wystąpić przed nim — 100% logic.

  11. Rafael - 20 marca 2009, 19:13:05

    @Paweł Ciupak: <marquee> i te sprawy mamy praktycznie w każdej przeglądarce. Sprawa jest tylko tej natury, że np. w Firefoksie implementacja <marquee> to tylko taka proteza (IIRC) w postaci odpowiedniego XBLa. <marquee> jest po prostu, żeby był, bo IE to obsługuje.

    Co do pasków przewijania, napisałem, że jest to dla mnie szokująca wiadomość. Znowu się zacznie kolorowanie pasków przewijania jakimiś dziwnymi kolorami czy kształtami. Jak ktoś to dobrze zrobi, nie będę się sprzeciwiał i z tym walczył, ale „poprawne” zrobienie takiego komponentu jak scrollbar to nie 10 minut pracy tylko kwestia przemyślenia wielu rzeczy. Po pierwsze scrollbar powinien być odróżnialny od reszty elementów strony. A w przypadku IE widziałem wiele stron, gdzie scroll był tak masakrycznie pokolorowany, że ciężko było rozróżnić gdzie są jego poszczególne części. Poza tym trzeba pomyśleć o użytkownikach z różnymi odmianami daltonizmu czy z innymi wadami wzroku. Użytkownik sobie tak konfiguruje system, żeby mógł swobodnie się w nim poruszać. A tu mamy swego rodzaju atak na dostępność i użyteczność, bo wiele amatorów tworzenia stron nie będzie patrzyło na te aspekty, bo dla nich będzie się liczył tylko dobry wygląd.

    Dobrze by było, gdyby przeglądarki oferowały (w sumie na wzór Opery) możliwość wyłączenia tej funkcjonalności.

    PS. i w ogóle coś mi się widzi, że na zmianie scrollbarów się nie skończy i doczekamy się większej liczby „dziwactw” ze strony deweloperów Webkita. Silnik ten zdobywa coraz to większą popularność (i na moje oko proces ten jest bardziej dynamiczny niż w przypadku Gecko). I nie mówię tutaj o użytkownikach końcowych, ale głównie o zastosowaniach korporacyjnych jako podstawa budowania różnych aplikacji bazujących na Webkicie. Przypuszczam, że doczekamy się drugiego – obok IE – bubla, którego będziemy przeklinać. Przeklinać nie za niezgodność ze standardami (bo tutaj za wiele nie można się przyczepić), ale za te dodatkowe bajery.

  12. Chris Trynkiewicz - 21 marca 2009, 23:17:06

    Wypas. Zbedny, rzecz jasna. Kolorowe scrollbary wyszly z mody 100 lat temu.

  13. Wasacz - 21 marca 2009, 23:18:59

    Jeszcze wygląd kursora myszy można zmieniać – na własny. Nie pamiętam, które przeglądarki to mają.

  14. lukasz - 22 marca 2009, 08:57:20

    Chris Trynkiewicz – kretyńskie kolorowe scrollbary może i wyszły, ale nadaj jest zapotrzebowanie na coś lepszego.

  15. Chris Trynkiewicz - 22 marca 2009, 09:30:13

    btw resizable text fields to jakies nieporozumienie – zacznie sie rozwalanie layoutow. co innego, gdyby robili cos na gust lightboxa…

  16. lukasz - 22 marca 2009, 10:06:10

    To jest akurat świetne, bo to nie Ty masz decydować o tym co robi użytkownik, lightbox narzuca Ci oglądanie obrazka na tej samej stronie/karcie/zakładce co w 99% spowalnia proces wczytywania grafiki.

  17. Chris Trynkiewicz - 22 marca 2009, 10:07:03

    lightbox spowalnia wczytywanie graiki? ciekawe

  18. lukasz - 22 marca 2009, 10:08:47

    Tak, czekasz na załadowanie skryptu, wyświetlenie okna, i dopiero później wczytuje się grafika odpowiednia, szybciej otwiera się grafikę bezpośrednio w nowej zakładce, bez zbędnych efektów,grafik.

  19. Chris Trynkiewicz - 22 marca 2009, 10:15:01

    ja bym powiedzial ze odpalenie lightboxa zajmuje tyle samo miejsca co nowej zakladki. dolicz czas na zamkniecie zakladki klawiszami lub mysza i wychodzi ze obsluga lightboxa jest szybsza overall i to dosyc zdecydowanie…

  20. Paweł Ciupak - 22 marca 2009, 11:33:07

    Może nie spowalnia, ale niesamowicie wkur!@#$ – człowiek chce sobie obejrzeć normalnie jakąś grafikę w pełnym rozmiarze, a tu łup! jak mu taki lightbox nie wyskoczy. No cóż, mamy Web 2.0, a strony i tak są kreowane zgodnie z trendami Web 1.0, tylko że z wykorzystaniem nowych technologii…

  21. Michał Górny - 22 marca 2009, 11:39:48

    Chris Trynkiewicz: Nie wiem, czy wiesz, ale niektóre przeglądarki posiadają taki przycisk (a nawet gest!) o nazwie „wstecz”. Niektórzy potrafią go używać, kiedy np. chcą szybko rzucić okiem na obrazek i wrócić do strony. Bez czekania na durne animacje, z możliwością normalnej regulacji rozmiaru samego obrazka i z możliwością szybkiego powrotu.

  22. Rafael - 22 marca 2009, 14:20:30

    Jeszcze wygląd kursora myszy można zmieniać – na własny. Nie pamiętam, które przeglądarki to mają.

    @Wasacz: IE od wersji co najmniej 6, Firefox (Gecko), Safari (Webkit). Jedynie w aktualnej stabilnej wersji Opery nie ma obsługi własnych kursorów. Nie wiem jak z Operą 10.

    Widzę, że dyskusja zeszła też na skrypty typu lightbox. Nie pierwsi zauważyliście wady tego typu skryptów. Niektórzy spróbowali rozwiązać problem poprzez umieszczenie w rogu miniatury małego obrazka, który prowadził bezpośrednio do zdjęcia (a cała miniatura otwierała lightboxa) lub odwrotnie (miniatura otwierała zdjęcie w oknie przeglądarki, mały obrazek w rogu odpalał lightboxa).

    Ogólnie, żadna z tych rzeczy nie byłaby zła, gdyby nie webmasterzy, którzy nieudolnie wykorzystują omawiane możliwości przeglądarek.

Pozostaw komentarz

Copyright © 2003-2011 Rafał Kukawski. Powered by Jogger | RSS Subskrybuj