Změna obrázku po najetí myší

[fyzma]

Dobrý den,

název tématu je možná trošku zavádějící, ale nenašel jsem lepší způsob jak to pojmenovat.

Mám obrázek mapy a v něm vyznačené trasy. Potřeboval bych, aby se mi po najetí na vybranou trasu ta trasa více zvýraznila (to mám již druhý obrázek, kde je zvolená trasa více zvýrazněná), problém však je, že se mi zvýrazněná trasa objeví jakmile najedu na původní mapu, nemusím ani najet na trasu. Nevíte jak udělat, aby se trasa zvýraznila až po najetí na libovolnou část trasy?

Zde přikládám odkaz na kterém je vidět, jak to myslím.

http://www.kemp-krumlov.cz/kolobezky/index.php?odkaz=trasy


Stránky jsou stále ve výstavbě, nejde mi tedy o hodnocení stránek, přidávám je pouze k pochopení mého problému. Viz první dvě mapy.

Předem děkuji za radu

[faraon]

http://www.jakpsatweb.cz/enc/onmouseover.html Pomohlo by?

[Narthelianail]

Také jsem na to hledal způsob, ale žádný mi nevyhovoval. Zkoušel jsem i jeden javascript, ale nefungoval dle mých představ, proto jsem si napsal vlastní kód.

<p style="text-align: center;"><a href="ODKAZ PO KLIKNUTÍ"><img style="line-height: 1.5; width: ŠÍŘKA OBRÁZKU V PIXELECHpx; height: VÝŠKA OBRÁZKU V PIXELECHpx;" onmouseover="this.src='ODKAZ NA DRUHÝ OBRÁZEK';" onmouseout="this.src='ODKAZ NA PRVNÍ OBRÁZEK';" alt="" src="ZNOVU ODKAZ NA PRVNÍ OBRÁZEK" /></a><span style="line-height: 1.5;">    </span>

[CZechBoY]

prej zkoušel jsem javascript ale nefungoval a prskne kod s javascriptem
Přes css není problém taky :)

Kód: Vybrat vše

#img {background: url('obrazek.png');}
#img:hover {background-image: url('obrazek-hover.png');}
 

[Petr Hnátek]

Pokud to dobře chápu, tak ty chceš, aby se ta trasa zvýraznila jen při najetí na tu trasu.
Akorát jde o to, že to je 1 velký obrázek bez zvýraznění a 1 velký obrázek s zvýrazněním, tudíž by jsi musel mít obrázek pouze s tou čárou jakožto zvýraznění té trasy.

[Narthelianail]

Zkoušel jsem javascrip z určité stránky, možná jsem to měl líp formulovat. Konkrétně z této - http://www.klikzone.cz/javascript/ukazk ... i-mysi.php
Problém je však v tom že tento kód nezvládá více jak jeden měnící se obrázek na stránce, a tak jsem musel sáhnout po poznámkovém bloku a napsat si vlastní :)

[LuCaCZ]

a co použít image <map> a na <area> onmouseover ?

[CZechBoY]

Polygonová mapa bude asi jediný řešený...
Případně ještě můžeš udělat nějakej megalomanskej javascript na zjištění barvy pixelu, že by to označilo samo

[LuCaCZ]

i ta image mapa bude dost otrocká, sice to uděláš jednou, ale dá to dost práce ... možná bych se ještě zamyslel nad API mapy.cz ty mají i turistickou vrstvu

[CZechBoY]

Jo no, vlastně když použiješ google maps api tak můžeš dělat různý čáry, polygony atd. Myslím že i plánovat tam můžeš tak ti to obtáhne silnice.