 [JavaScript][HTML][CSS] Podświetlane elementy mapy |
| [JavaScript][HTML][CSS] Podświetlane elementy mapy |
Post
#1
|
|
|
Grupa: Nieautoryzowani Postów: 11 Pomógł: 0 Dołączył: 25.09.2017 Ostrzeżenie: (0%) 
 |
Witam, mam mapę województwa podzielonego na powiaty. Kod ma za zadanie podświetlić wybrany powiat, kiedy najedziemy na niego kursorem myszy. W moim kodzie jest błąd, którego nie wiem jak rozwiązać, aby powiat się podświetlał. Aktualnie skonfigurowane są 2 powiaty, bo chciałem sprawdzić czy kod zadziała... nie działa. Co mam poprawić aby dany powiat podświetlał się gdy na niego najadę kursorem?
HTML + JS Kod <!DOCTYPE html> <html> <head> <link rel="stylesheet" type="text/css" href="style.css" /> </head> <body onload=""> <div class="mapka"> <script type='text/javascript'> if(document.images) { imagemap_default = new Image(); imagemap_default.src = 'malopolska_mapa.png'; imagemap_1 = new Image(); imagemap_1.src = 'bochenski.png'; imagemap_2 = new Image(); imagemap_2.src = 'olkuski.png'; imagemap_3 = new Image(); imagemap_3.src = 'dabrowski.png'; imagemap_4 = new Image(); imagemap_4.src = 'proszowicki.png'; imagemap_5 = new Image(); imagemap_5.src = 'krakowski.png'; imagemap_6 = new Image(); imagemap_6.src = 'chrzanowski.png'; imagemap_7 = new Image(); imagemap_7.src = 'oswiecimski.png'; imagemap_8 = new Image(); imagemap_8.src = 'wadowicki.png'; imagemap_9 = new Image(); imagemap_9.src = 'suski.png'; imagemap_10 = new Image(); imagemap_10.src = 'nowatorski.png'; imagemap_11 = new Image(); imagemap_11.src = 'tarzanski.png'; imagemap_12 = new Image(); imagemap_12.src = 'nowosadecki.png'; imagemap_13 = new Image(); imagemap_13.src = 'gorlicki.png'; imagemap_14 = new Image(); imagemap_14.src = 'tarnowski.png'; imagemap_15 = new Image(); imagemap_15.src = 'brzeski.png'; imagemap_16 = new Image(); imagemap_16.src = 'bochenski.png'; imagemap_17 = new Image(); imagemap_17.src = 'wielicki.png'; imagemap_18 = new Image(); imagemap_18.src = 'myslenicki.png'; imagemap_19 = new Image(); imagemap_19.src = 'limanowski.png'; } function rollOver(iName,iState) { if(document.images) { document.images[iName].src = eval(iName + '_' + iState + '.src'); } } </script> <div><img src="malopolska_mapa.png" alt="" /><img src="malopolska_mapa.png" style=" z-index: 2; position: relative; left:-220px; " usemap="#map" name="imagemap" alt="" /></div> <map name="map"> <area shape="poly" coords="134,67,133,63,132,63,131,59,130,59,129,60,126,59,125,59,123,59,123,61,118,62 ,118,68,121,71,122,78,120,80,120,82,115,82,115,90,110,95,110,98,109,98,109,100,10 9,103,111,103,112,104,113,106,115,104,118,104,120,107,121,109,131,108,131,106,134 ,105,134,101,139,100,137,96,138,90,136,89,134,85,136,84,136,78,138,78,140,71,142, 71,142,69,139,68,138,67,134,67" href="#" onmouseover="rollOver('imagemap','bochenski')" onmouseout="rollOver('imagemap','default')" alt="" /> <area shape="poly" coords="149,55,149,51,148,50,142,57,140,57,139,58,134,58,132,59,133,62,133,63,134,64 ,134,66,139,66,144,68,143,71,141,72,139,79,137,79,137,83,137,84,136,85,134,86,137 ,89,138,89,138,93,137,95,138,96,138,97,139,99,139,101,134,101,135,104,135,104,135 ,106,135,107,141,110,143,109,143,107,144,107,144,106,146,106,146,105,152,105,151, 101,152,97,152,91,155,91,156,91,156,90,155,90,155,85,157,84,155,83,156,79,154,77, 154,75,156,74,157,76,158,74,158,74,154,73,154,70,156,69,156,67,156,64,154,62,152, 62,152,61,154,61,154,58,153,56,150,56,149,55" href="#" onmouseover="rollOver('imagemap','brzeski')" onmouseout="rollOver('imagemap','default')" alt="" /> </map> </div> </body> </html> CSS Kod .mapka { width:220px; overflow: hidden; } .mapka > div{ width:440px; margin-top:5px; } .mapka > div > img { width: 220px; } |
 |
 
|
STR13 [JavaScript][HTML][CSS] Podświetlane elementy mapy 16.10.2017, 10:15:06 
nospor eval(iName + '_' + iState + '.src... 16.10.2017, 10:17:24 STR13 Cytat(nospor @ 16.10.2017, 11:17:24 )... 16.10.2017, 10:32:10 nospor eee? A niby jakim cudem?
Pytam dokladnie o ten kaw... 16.10.2017, 10:34:00 STR13 Cytat(nospor @ 16.10.2017, 11:34:00 )... 16.10.2017, 10:48:34 nospor czyli nie wiesz co robi ten kawalek kodu...
No dob... 16.10.2017, 10:51:14 STR13 Cytat(nospor @ 16.10.2017, 11:51:14 )... 16.10.2017, 11:09:14 viking Ściągasz sobie plik https://upload.wikimedia.org/w... 16.10.2017, 11:11:11 nospor evaluujesz
eval("imagemap_brzeski.src ")... 16.10.2017, 11:16:24 STR13 Cytat(nospor @ 16.10.2017, 12:16:24 )... 16.10.2017, 11:21:48 trueblue W temacie, który cytujesz jest wyjaśnienie. Gdybyś... 16.10.2017, 11:25:40 viking Użyj to co podałem a nie jakieś rozwiązania staroż... 16.10.2017, 11:26:51 STR13 Okej podświetlać się podświetla, ale gdy najeżdżam... 16.10.2017, 11:40:45 nospor Bo podmieniasz caly zrodlowy plik z wieksza mapa n... 16.10.2017, 11:46:17 viking Kilka miesięcy temu o to pytałem w kontekście mapy... 16.10.2017, 11:52:48 STR13 Cytat(viking @ 16.10.2017, 12:52:48 )... 16.10.2017, 11:59:08 viking Tak. 16.10.2017, 12:59:20 STR13 Pobrałem svg mapy, wrzuciłem go do html, dodałem p... 16.10.2017, 13:41:15 
nospor Czemu w css nadajesz style dla elementu o klasie P... 16.10.2017, 15:21:39   |
|
Aktualny czas: 24.08.2025 - 11:54 |
