Autor Zpráva
MaximCZ
Profil
Zdravím, chci se zeptat jestli by nějak šlo pomocí HTML(5) udělat aby měl obrázek s postavou (okolí bílá) hover tak, že by při najetí postava třeba zesvětlila. Myslím při najetí přesně na obrys té postavy.
Tady je obrázek pro představu. http://cerny.maxcz.cz/work/postava.png prostě najedu na černou postavu a ona se trochu zesvětlí. Možná nějak pomocí klikací mapy? obrázek nebude mít odkaz, jen aby fungoval hover, díky za rady
baltazar
Profil *
Všechno jde. Můžeš to udělat bud css opacity nebo podstrčit v css světlejší obrázek pro hover. Je i mnoho dalších vychytávek, ale tyhle jsou nejmín náročné.
Chamurappi
Profil
Reaguji na MaximaCZ:
Možná nějak pomocí klikací mapy?
Ano. Při přejetí <area> změníš obrázku src, nebo viditelnost nějakému překrývajícímu průsvitnému elementu. A při odjetí vše vrátíš do původního stavu.
margin
Profil *
Podařilo se mi najít řešení bez klikací mapy, nevýhodou je, že funguje až v IE9, přesněji v prohlížečích s podporou elementu canvas.
http://www.zdrojak.cz/clanky/obrazova-mapa-s-hover-efektem/?show=comments#comment-17356
MaximCZ
Profil
Díky moc zatím za rady, bude to ještě asi složitější, ten obrázek je zatím jako pozadí, protože je široký 1600px a nesmí roztahovat web aby tam skákal posuvník při nižším rozlišení...
Petr ZZZ
Profil
MaximCZ:
obrázek nebude mít odkaz, jen aby fungoval hover
Jen poznámka na okraj: Dávat hover něčemu, co nikam nekliká, mi nepřijde moudré.
Chamurappi
Profil
Reaguji na MaximaCZ:
bude to ještě asi složitější
Ani moc ne, ten obrázek absolutně vycentruješ do obalu s šířkou 100% a overflow: hidden. Nemusí být jako pozadí.
MaximCZ
Profil
Ta (Mapa ČR) je super, tu určitě někdy využiju. Takže díky.
Tady mam rozdělanou ukázku toho co potřebuju.... http://testy_oop.maxcz.cz
když najedu na tu černou plochu, tak chci aby celá zfialověla... jak při najetí na area podšoupnu tý mapě jiný src obrázku (bez JS) ?


Vyřešil jsem to pomocí onmouseover a onmouseout, to mi bude stačit, takže díky moc za rady.

Vaše odpověď


Prosím používejte diakritiku a interpunkci.

Ochrana proti spamu. Napište prosím číslo dvě-sta čtyřicet-sedm: