Ocena wątku:
  • 0 głosów - średnia: 0
  • 1
  • 2
  • 3
  • 4
  • 5
rozjaśnianie fragmetu fotografii po najechaniu
#1
Odpowiedz
#2
Część pracy masz za sobą.
Teraz robisz taki kod:
<ul>
<li class="nazwa_wojewodztwa" map="....">Nazwa wojewodztwa</li>
...
...
</ul>

Każdemu LI dajesz position:absolute; odpowiednie widh, height, left i top. Dajesz im też odpowiednie przesunięcie tła (uejmne) którym jest mapa spritów przedstawiająca poszczególne województwa. Potem każdemu LI dla hover albo zmieniasz pozycję backgrounda, albo zmieniasz obrazek (lepsze to pierwsze).
Czyli obrazek spritów powinien wyglądać mniej więcej tak:

[kontur wojewodztwa] [kontur wojewodztwa po najechaniu]
[kontur wojewodztwa] [kontur wojewodztwa po najechaniu]
[kontur wojewodztwa] [kontur wojewodztwa po najechaniu]
[kontur wojewodztwa] [kontur wojewodztwa po najechaniu]
[kontur wojewodztwa] [kontur wojewodztwa po najechaniu]
[kontur wojewodztwa] [kontur wojewodztwa po najechaniu]

Jak najezdzasz na wojewodztwo po prostu zmieniasz pozycję x backgrounu na bardziej ujemną ;]


Możesz też zawsze skorzystać z gotowych rozwiazań:
http://winstonwolf.pl/clickable-maps/polska.html
Odpowiedz
#3
Ja próbuje to zrobić w inny sposób

Kod HTML
Kod:
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
</head>
<body>
<p>
    <img src="http://img850.imageshack.us/img850/3677/regionywww3.jpg" border="0" usemap="#Map" />
  <map name="Map" id="Map">
  <area shape="poly" coords="241,5,297,10,316,28,330,43,344,49,334,61,315,81,308,127,283,145,212,146,116,198,64,284,40,282,31,273,32,245,4,218,6,207,18,181,10,108,26,86" href="1" alt="1" />      
    <area shape="poly" coords="567,265,546,260,537,245,496,209,422,223,386,265,322,193,309,170,282,154,306,131,316,83,346,51,394,59,450,65,494,62,534,61,540,56,553,63,562,69,578,82,580,99,607,187,608,205,606,233" href="2" alt="2" />
    <area shape="poly" coords="282,147,212,147,116,198,98,235,65,284,78,287,133,279,144,273,152,280,190,286,216,295,236,298,266,308,300,308,316,269,346,275,384,267" href="3i" alt="3" />
    <area shape="poly" coords="40,283,40,293,42,297,42,308,34,323,45,341,42,350,56,356,58,369,61,376,48,414,60,404,70,403,77,414,84,423,97,425,110,427,114,433,122,441,127,437,134,436,147,441,136,455,139,463,152,472,162,489,181,477,176,459,202,469,207,474,226,469,228,476,221,485,228,491,236,502,248,493,267,473,280,455,317,441,360,441,375,415,346,374,337,337,307,330,304,309,232,297,220,297,154,281,147,274,133,280,86,287,66,285" href="4" alt="4" />
    <area shape="poly" coords="302,305,316,271,363,274,386,264,401,253,420,223,495,208,544,257,565,264,561,272,563,278,589,294,588,314,588,326,583,345,592,361,589,371,616,415,609,420,616,429,610,460,577,478,542,462,492,458,473,438,415,436,374,414,349,379,340,349,331,334,305,329" href="5" alt="5" />
    <area shape="poly" coords="374,417,392,428,423,438,474,441,489,459,541,463,576,479,528,543,534,559,532,575,542,587,543,593,529,590,516,585,512,581,503,581,500,576,492,575,488,564,476,559,466,553,454,556,446,553,442,557,434,554,433,560,423,564,412,557,403,555,403,561,395,556,391,558,386,556,386,562,376,563,369,577,363,573,353,575,353,558,344,557,339,553,334,540,357,485,350,479,338,476,335,470,356,447" href="6" alt="6" />
    <area shape="poly" coords="246,495,260,477,278,456,316,441,356,442,334,470,336,477,350,481,356,485,334,539,326,539,324,545,318,545,317,552,312,555,304,556,301,547,294,546,292,530,280,528,277,509,260,507,253,501" href="7" alt="7" />
  </map>
</p>

</body>
</html>
Brakuje tylko podświetlenia regionu po najechaniu myszą

Nie mogę skorzystać z gotowca do którego dałeś link bo ja nie chcę województw, tylko inne regiony Polski.

Robiąc od nowa mapkę twoim sposobem zajęło by mi to dużo czasu i było pracochłonne
Odpowiedz
#4
Odpowiedz


Podobne wątki…
Wątek: Autor Odpowiedzi: Wyświetleń: Ostatni post
  Jak wywołać dźwięk odnośnika po najechaniu myszką ? puma 7 5,694 09-01-2012, 23:47
Ostatni post: n0xx
  Jak zrobić aby po najechaniu na łącze podświetlało go na inny kolor? messi19125 3 3,243 20-05-2011, 15:48
Ostatni post: messi19125
  Jak zrobić button, by po najechaniu myszką zmienił się na inny obrazek? kondziu1291 8 7,297 08-03-2011, 01:04
Ostatni post: kondziu1291
  Interaktywny obrazek- dźwięk po najechaniu na obrazek bukichektor 1 2,328 10-05-2010, 07:32
Ostatni post: Labsta.com

Skocz do:


Użytkownicy przeglądający ten wątek: 1 gości
Sponsorzy i przyjaciele
SeoHost.pl