Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: Pilna pomoc przy mapce
Forum PHP.pl > Forum > Po stronie przeglądarki > JavaScript
SpiJay
Witam !

Potrzebuję nadać zachowania po najechaniu muszką na jeden z kontynentów.
Np. Najeżdżam na Europę i pojawia się DIV o ID #box_europa i tak dalej z każdym państwem,

Moja strona http://spijay.com/demo/corp/?page_id=4

Pozdrawiam,
Patryk
Mayka
Ja bym to podzielił na konkretne czesci i funkcja .mouseover() powinno wystarczyć, http://api.jquery.com/mouseover/
SpiJay
Tylko, że tutaj jest mnóstwo span-ów.. :/
W dokumentacji było coś takiego:
[JAVASCRIPT] pobierz, plaintext
  1. // custom events
  2. 'onHover' : function(e){}, // Callback: function(listItem) - Fires when the mouse pointer enters a region and passing a current list item element;
[JAVASCRIPT] pobierz, plaintext


I to działa, ale dla każdego z kontynentów, jak więc określić aby np. onHover #europa działało tylko po najechaniu na Europe ?
d3ut3r
Cytat
Fires when the mouse pointer enters a region and passing a current list item element;


a co jest w tym listItem ? być może na podstawie którejś z właściwości dasz radę odróżniać kontynenty.
Kshyhoo
Coś w tym stylu?
Pawel_W
Cytat(Kshyhoo @ 30.11.2012, 17:55:54 ) *

to jest ten sam skrypt smile.gif
kamil4u
Nie znam tego skryptu.Ty podałeś minimum informacji. Żadnej informacji jak to używasz, jak to działa itd. Możliwe, że twórca tego skryptu wymyślił eleganckie rozwiązanie, ale trudno to stwierdzić bez dokładnie opisanego kodu lub API. Daj link do dokumentacji jak chcesz dowiedzieć się jak to zrobić porządnie.

Dlatego podam rozwiązanie "na około":
1. Masz tam div-a w którym trzymasz wszelkie mapy: <div id="map-continents" class="css-map-container m850">
2. Div ten zawiera listę: <ul class="continents css-map">
3. Ta lista zawiera <li>, które po najechaniu na nie zmieniają swoją klasę na "focus"

I to wszystko. Teraz wystarczy dobrać się do tego div-a, znaleźć element o klasie focus, sprawdzić co to za element i na tej podstawie wyświetlić odpowiednie informacje.

----
Prawdopodobnie to co podałeś zastępuje to co napisałem wyżej.
Jeżeli chcesz użyć tego 'onHover' to prawdopodobnie działa to tak:
Kod
'onHover': function( li ){ alert(li.innerHTML); }


Dzięki temu po najechaniu na dowolny element dostaniesz alert-a z konkretnym li. Zmienna li będzie zawierała referencję do konkretnego elementu listy( li ), czyli tego z punktu 3.

Myślę, że się domyślisz o co chodzi, ale to zależy na jakim poziomie JS jesteś.

Powodzenia w razie czego pytaj.
Winston_Wolf
Cytat(SpiJay @ 30.11.2012, 11:23:28 ) *
Witam !

Potrzebuję nadać zachowania po najechaniu muszką na jeden z kontynentów.
Np. Najeżdżam na Europę i pojawia się DIV o ID #box_europa i tak dalej z każdym państwem,

Moja strona http://spijay.com/demo/corp/?page_id=4

Pozdrawiam,
Patryk


Nie łatiwej było od razu do mnie pisać?

Jest tam opcja 'List of addresses'. Tworzysz diva z listą, w której każdy element ma ID taki jak odnośnik (hash) w mapie:

Kod
<div id="addresses">
<ul>
  <li id="albania">
  <!-- Albania -->

  </li>
  <li id="andorra">
  <!-- Andorra -->

  </li>
  <li id="bosnia-and-herzegovina">
  <!-- Bosnia and Herzegovina -->

  </li>
</ul>
</div>

Oczywiście do każdego elementu listy możesz wrzucić dowolny kod.

..a następnie wywołujesz funkcję mapy:

Kod
$('#map-europe').cssMap({
  size: 810,
  agentsListId : '#addresses'
  agentsListOnHover : true
});
To jest wersja lo-fi głównej zawartości. Aby zobaczyć pełną wersję z większą zawartością, obrazkami i formatowaniem proszę kliknij tutaj.
Invision Power Board © 2001-2025 Invision Power Services, Inc.