Ustawienia
Możesz ukryć lub zmienić położenie listy województw poprzez zmianę klasy div.a #mapa
<div id="mapa" class="ukryta tooltip">
ukryta tooltipukryta lista z nazwami województw na mapie (domyślnie)po_lewejlista województw po lewej stronie mapki; z nazwami województw na mapie: po_lewej tooltippo_prawejlista województw po prawej stronie mapki; z nazwami województw na mapie: po_prawej tooltipponizejlista województw poniżej mapki lub ponizej tooltip, aby wyświetlić nazwy województw na mapce ..wygląd listy możesz modyfikować w dowolny sposób w arkuszu stylów CSS:
#mapa alista województw#mapa li:hover, #mapa a:focuszaznaczone województwo#mapa a.active, #mapa a:activeaktywne województwo ..dodatkowo możesz zmienić:
#loaderstyl preloader'a#mapa .ttstyl nazw województw wyświetlanych na mapce; dodatkowo w pliku 'pl-mapa-240px.css' (na końcu arkusza) możesz skorygować położenie nazw na mapie lub zmienić styl 'dymka' dla poszczególnych województw ..opcje aktywowania województw znajdziesz w pliku pl-mapa.js
Oczywiście możesz dowolnie zmienić wygląd samej mapy ...
Instalacja
Wklej poniższy kod do swojego pliku html:
<div id="mapa" class="ukryta tooltip">
<ul id="pl">
<li id="pl1"><a href="#dolnoslaskie" title="Dolnośląskie">Dolnośląskie <span class="bg"></span></a></li>
<li id="pl2"><a href="#kujawsko-pomorskie" title="Kujawsko-pomorskie">Kujawsko-pomorskie <span class="bg"></span></a></li>
<li id="pl3"><a href="#lubelskie" title="Lubelskie">Lubelskie <span class="bg"></span></a></li>
<li id="pl4"><a href="#lubuskie" title="Lubuskie">Lubuskie <span class="bg"></span></a></li>
<li id="pl5"><a href="#lodzkie" title="Łódzkie">Łódzkie <span class="bg"></span></a></li>
<li id="pl6"><a href="#malopolskie" title="Małopolskie">Małopolskie <span class="bg"></span></a></li>
<li id="pl7"><a href="#mazowieckie" title="Mazowieckie">Mazowieckie <span class="bg"></span></a></li>
<li id="pl8"><a href="#opolskie" title="Opolskie">Opolskie <span class="bg"></span></a></li>
<li id="pl9"><a href="#podkarpackie" title="Podkarpackie">Podkarpackie <span class="bg"></span></a></li>
<li id="pl10"><a href="#podlaskie" title="Podlaskie">Podlaskie <span class="bg"></span></a></li>
<li id="pl11"><a href="#pomorskie" title="Pomorskie">Pomorskie <span class="bg"></span></a></li>
<li id="pl12"><a href="#slaskie" title="Śląskie">Śląskie <span class="bg"></span></a></li>
<li id="pl13"><a href="#swietokrzyskie" title="Świętokrzyskie">Świętokrzyskie <span class="bg"></span></a></li>
<li id="pl14"><a href="#warminsko-mazurskie" title="Warmińsko-mazurskie">Warmińsko-mazurskie <span class="bg"></span></a></li>
<li id="pl15"><a href="#wielkopolskie" title="Wielkopolskie">Wielkopolskie <span class="bg"></span></a></li>
<li id="pl16"><a href="#zachodniopomorskie" title="Zachodniopomorskie">Zachodniopomorskie <span class="bg"></span></a></li>
</ul>
</div>
..w nagłówku strony dodaj plik CSS, najnowszą wersję biblioteki
jQuery (jeżeli nie było wcześniej) oraz skrypt:
<link rel="stylesheet" type="text/css" media="screen,projection" href="pl-mapa-240px.css" />
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.3/jquery.min.js"></script>
<script type="text/javascript" src="pl-mapa.js"></script>
..plik CSS musi być załadowany przed skryptami!