Mapa świata – tylko html i css
| kategoria: CSS, HTML i XHTML, Programowanie, Skrypty | Komentarze (0)
Większość jakichkolwiek map geograficznych, które spotykamy w internecie, tworzone są przy użyciu technologii java lub flash. Tymczasem obie technologie mają swoje wady dostępności, przez co niektórzy w ogóle mogą mapy nie zobaczyć/usłyszeć. Ponadto zmuszają nas do zainstalowania odpowiednich plugin-ów. Niemniej jednak można pokusić się o stworzenie mapy geograficznej przy użyciu tylko html i css. Na poniższym przykładzie pokażemy jak można taką mapę świata zbudować.
Zaczynamy od prostej listy kontynentów:
Następnie przygotowujemy odpowiednio plik graficzny z mapą tak, aby na samej górze była cała mapa świata, a pod nią wycięte, prostokątne fragmenty interesujących nas obszarów. Oczywiście każdy w dokładnie takiej pozycji, w jakiej jest oryginalny fragment oraz w sposób wyróżniony.
Potem wystarczy już tylko spozycjonować odpowiednio blok ... i cała mapa gotowa: http://www.ikeris.com/lab/world-map/world-map.php. Podane rozwiązanie działać powinno w każdej przeglądarce, a i współpraca z czytnikami ekranu nie powinno sprawiać kłopotów. Wadą tego rozwiązania jest to, że pewne obszary nakładają się. Nie można też wyznaczyć dokładnych krawędzi, ponieważ wszystko oparte jest o prostokątne bloki.
Warto zajrzeć jeszcze
(Nie ma jeszcze głosów, ale możesz być pierwszy)Komentarze
Możesz zostawić komentarz lub wysłać sygnał trackback ze swojej strony.
Zanim dodasz komentarz, to zapoznaj się z zasadami dotyczącymi komentarzy.