-
11. Data: 2011-08-18 12:15:44
Temat: Re: Jak zrobić graficzny roll over? [ot]
Od: "|<onrad" <k...@g...pl>
On Thu, 18 Aug 2011 13:32:26 +0200, beherit wrote:
> hociaż nie wiem czy uznajesz ją za
>>> >>,,istotną" przeglądarkę<<.
>>
>> w chrome 15.0 tez to jest kolorowe. dziala chyba tylko w firefoksie
>
> ooo.... a ja testuje serwisy Klientów na wersji bodajże 7 chroma :).
stabilny chrome to teraz 13.0 (albo 12.x, a trzynastka bedzie za kilka
dni)
--
pozdrawiam, Konrad Karpieszuk
-
12. Data: 2011-08-18 13:35:23
Temat: Re: Jak zrobić graficzny roll over? [ot]
Od: Paweł Piskorz <n...@p...nie?>
W dniu 2011-08-18 14:15, |<onrad pisze:
> On Thu, 18 Aug 2011 13:32:26 +0200, beherit wrote:
>
>> hociaż nie wiem czy uznajesz ją za
>>>> >>,,istotną" przeglądarkę<<.
>>>
>>> w chrome 15.0 tez to jest kolorowe. dziala chyba tylko w firefoksie
>>
>> ooo.... a ja testuje serwisy Klientów na wersji bodajże 7 chroma :).
>
> stabilny chrome to teraz 13.0 (albo 12.x, a trzynastka bedzie za kilka
> dni)
Od 2 sierpnia jest już 13.
--
message[autor="PablO"]::after {
content:"Pozdrawiam";
}
-
13. Data: 2011-08-18 13:36:12
Temat: Re: Jak zrobić graficzny roll over?
Od: Paweł Piskorz <n...@p...nie?>
W dniu 2011-08-17 21:01, MarekF pisze:
> Czy jest jakis specjalny powod, aby nie stosowac 2 zdjec, czarno bialego
> i kolorowego?
Zapewne jeden zasadniczy - lenistwo :)
--
message[autor="PablO"]::after {
content:"Pozdrawiam";
}
-
14. Data: 2011-08-18 17:21:39
Temat: Re: Jak zrobić graficzny roll over?
Od: Marek <p...@s...com>
Dnia Wed, 17 Aug 2011 16:25:17 +0200, Mirosław Zalewski napisał(a):
>
> I niedziałającego w Operze (11.50), chociaż nie wiem czy uznajesz ją za
> >>,,istotną" przeglądarkę<<.
Raczej nie gdyż to 7.5% userów. Jednakże problem jest z Chromem. :-(
Napisano tam przy okazji, że temat SVG (ale czy filtrów?) ma być
standardowo rozwiązany w HTML5. Czy wiesz coś o tym? Póki co efekt
desaturacji mogę ograniczyć do IE i FF - to mi wystarczy gdyż to tylko
"bajer" nieistotny dla treści. Możemy więc temat uznać za zamkniety.
Interesuje mnie jednakże temat HTML5 jako wątek, który przy okazji dociekań
powstał.
-
15. Data: 2011-08-18 17:24:55
Temat: Re: Jak zrobić graficzny roll over?
Od: Marek <p...@s...com>
Dnia Wed, 17 Aug 2011 21:01:09 +0200, MarekF napisał(a):
> Czy jest jakis specjalny powod, aby nie stosowac 2 zdjec, czarno bialego i
> kolorowego? Wiem, ze pytanie nie na temat, bo ma byc tylko zdjecie kolorowe.
> 2 zdjecia i efekt taki sam.
> Jezeli dobrze pamietam, to w php bylo cos nt temat. 1 fotka.
> MarekF
Tak, są dwa nawet. Mianowicie redaktorowi strony mało zorientowanemu w
obróbce zdjęć nie będzie się chciało przetwarzać fotek do 2 postaci. Po
drugie to zdjęcie to miniaturka reprezentująca dokument w CMS. Wolałbym
uniknąć przerabiania CMS do stosowania 2 wersji miniaturki.
-
16. Data: 2011-08-18 17:26:34
Temat: Re: Jak zrobić graficzny roll over?
Od: Marek <p...@s...com>
Dnia Thu, 18 Aug 2011 15:36:12 +0200, Paweł Piskorz napisał(a):
> W dniu 2011-08-17 21:01, MarekF pisze:
>> Czy jest jakis specjalny powod, aby nie stosowac 2 zdjec, czarno bialego
>> i kolorowego?
>
> Zapewne jeden zasadniczy - lenistwo :)
hahaha - cóż za zbieżność spostrzeżeń :-D To samo odpisałem koledze.
-
17. Data: 2011-08-18 17:33:23
Temat: Re: Jak zrobić graficzny roll over?
Od: Marek <p...@s...com>
Dnia Wed, 17 Aug 2011 21:05:46 +0200, Peter May napisał(a):
>
> Zamiast SVG spóbuj canvas-a:
>
> http://www.ajaxblender.com/howto-convert-image-to-gr
ayscale-using-javascript.html
>
> Wcześniej podałem Ci link gdzie to działa z dynamicznym tworzeniem
> obrazków w szarościach.
Chciałem uniknąć jQuery. Z armatą na wróble. Zamiast angażowania tej
wielkiej maszyny wolałbym zastosować modulik we Flashu ładowany z JS. Parę
linijek kodu JS i pozamiatane. Piszę to w oderwaniu od mojego obecnego
problemu gdyż to tylko efekt więc można go ograniczyć do honorujących go
przeglądarek.
-
18. Data: 2011-08-18 18:41:29
Temat: Re: Jak zrobić graficzny roll over?
Od: Peter May <p...@o...pl>
W dniu 18-08-2011 19:33, Marek pisze:
> Dnia Wed, 17 Aug 2011 21:05:46 +0200, Peter May napisał(a):
>
>
>>
>> Zamiast SVG spóbuj canvas-a:
>>
>> http://www.ajaxblender.com/howto-convert-image-to-gr
ayscale-using-javascript.html
>>
>> Wcześniej podałem Ci link gdzie to działa z dynamicznym tworzeniem
>> obrazków w szarościach.
>
> Chciałem uniknąć jQuery. Z armatą na wróble. Zamiast angażowania tej
> wielkiej maszyny wolałbym zastosować modulik we Flashu ładowany z JS. Parę
> linijek kodu JS i pozamiatane. Piszę to w oderwaniu od mojego obecnego
> problemu gdyż to tylko efekt więc można go ograniczyć do honorujących go
> przeglądarek.
Kiedyś potrzebowałem też przerabiać "w locie" obrazki na szarości.
Skądś, nie pamiętam skąd, tam podejrzałem algorytm i nieco pozmieniałem
kod, który wygląda dziś tak:
http://jsfiddle.net/YysEP/
Generalnie robię tak:
1. Klonuję obrazek.
2. Przekazuję obiekt do funkcji.
3. Funkcja zwraca mi dane, które podstawiam do atrybutu src i nowo
wygenerowanego obrazka.
4. Dalej to już zabawa z CSS-em :-)
--
Peter
-
19. Data: 2011-08-27 11:41:17
Temat: Re: Jak zrobić graficzny roll over?
Od: "Marcin Wasilewski" <j...@a...pl>
Użytkownik "|<onrad" <k...@g...pl> napisał w wiadomości
news:j2gro1$in6$2@inews.gazeta.pl...
> On Wed, 17 Aug 2011 16:25:17 +0200, Mirosław Zalewski wrote:
>>> Zerknijcie na to:
>>> http://www.boogdesign.com/examples/svg/desaturate.ht
ml
>>> W międzyczasie znalazłem coś bardzo szybkiego w realizacji :-)
>> I niedziałającego w Operze (11.50), chociaż nie wiem czy uznajesz ją za
>> >>,,istotną" przeglądarkę<<.
> w chrome 15.0 tez to jest kolorowe. dziala chyba tylko w firefoksie
A poza tym źle są dobrane współczynniki składowych, które na pewno nie
wynoszą 0,33 na składową, jak to jest zrobione w tym przykładzie, a co za
tym idzie jest przekłamana luminancja.
Nie chce mi się szukać notatek z grafiki komputerowej, ale współczynniki
znacznie się różnią dla poszczegółnych składowych.
Nie ma jak to wiki:
To convert any color to a grayscale representation of its luminance, first
one must obtain the values of its red, green, and blue (RGB) primaries in
linear intensity encoding, by gamma expansion. Then, add together 30% of the
red value, 59% of the green value, and 11% of the blue value
-
20. Data: 2011-08-31 17:30:05
Temat: Re: Jak zrobić graficzny roll over?
Od: the_foe <t...@w...pl>
W dniu 2011-08-17 11:46, Marek pisze:
> Witam,
>
> Roll over ma być fotografią czarnobiałą. Po najechaniu robi się ona
> kolorowa. Zdjęcie w oryginale będzie tylko jedno - kolorowe. Czy jest jakiś
> sposób na spowodowanie aby fotka była monochromatyczna pod "istotnymi"
> przeglądarkami? Ostatecznie zastosuję Flash'a lecz wolałbym tego uniknąć.
najprostsze sa dwie metody:
1. robimy 2 obrazki, kolorowy i czarno-bialy i laczymy go w jeden, tak
aby sasiadowaly ze soba. robimy diva, ktoremu nadajemy w css atrubut
width height background-image background-position (wycinamy nasze
zdjecie wymiarami i pozycja tla). nastepnie robimy dla diva :hover z
pozycja background przesunieta o dlugosc (lub szerokosc, w zaleznosci
jak polaczylismy obrazki) obrazka. duza zaleta jest preloadowanie
drugiego obrazka (bo w rzeczywistosci przegladarka laduje jeden)
2. uzywamy js do podmiany src dla img:
<img src='pics/kolor.jpg'
onMouseOver="this.setAttribute('src','pics/czb.jpg')
;"
onMouseOut="this.setAttribute('src','pics/kolor.jpg'
);" />
zaleta tego rozwiazania jest, ze strona bedzie wyswitelac obrazek
niezaleznie od css czy js. Wada, ze bedzie zauwazalny pierwszy moment
zmiany obrazka. Mozna to rozwiazac pakujac w innym miejscu czarno-bialy
obrazek do diva z warroscia stylu display:none. Jest to jednak malo
eleganckie, ze wzgledu na to, ze przy wylaczeniu styli obrazek nam sie
dodatkowo wyswietli.
--
the_foe