Hei!
Haluaisin esittää matkustamistani graafisesti kartassa. Eli minulla on lista vuosilukuja joita klikkaamalla näkee kartasta ko vuoden matkan punaisena viivana.
Helpoin tapa olisi tietysti tehdä omia sivuja kaikille eri matkoille, mutta karttakuvatiedosto on iso (hidas latautumaan) ja itse yhden vuoden reitti on pieni (pelkkä punainen viiva)
Onko kellään mitään hyvää ehdotusta miten tämän helpoimmin tekisi?
(ei tarvitse lähettää koodia, osaan sen verran HTML ja javaScript että pelkkä periaate riittää. Ajattelin ensin tutustua lähemmin näihin Layereihin, mutta ne elävät ainoastaan NetScapissa?)
Haluaisin esittää matkustamistani graafisesti kartassa. Eli minulla on lista vuosilukuja joita klikkaamalla näkee kartasta ko vuoden matkan punaisena viivana.
Helpoin tapa olisi tietysti tehdä omia sivuja kaikille eri matkoille, mutta karttakuvatiedosto on iso (hidas latautumaan) ja itse yhden vuoden reitti on pieni (pelkkä punainen viiva)
Onko kellään mitään hyvää ehdotusta miten tämän helpoimmin tekisi?
(ei tarvitse lähettää koodia, osaan sen verran HTML ja javaScript että pelkkä periaate riittää. Ajattelin ensin tutustua lähemmin näihin Layereihin, mutta ne elävät ainoastaan NetScapissa?)
Vastaukset 2
Vanhimmat
Laitappas divin taustaksi kartta ja sen päälle laitat kuvan jossa on punanen viiva muuten läpinäkyvä, näin taustakuva haetaan selaimen muististä (kerran serveriltä), ja itse punainen viiva joka matkaa kohti serverilt.
Tai sitten jalostaen edellistä, http://www.meyerweb.com/eric/css/edge/popups/demo.html katso valikko, kuvittele vaihtuvelle teksille taustaksi kartta ja tekstin tilalle punenenviiva.
Joten välttämättä et tarvitse JS:ää ollenkaan. nykyään layerit on korvannut divit joilla onnistuu samat asiat.
»nykyään layerit on korvannut divit»
Tarkoitat varmaan että divit ovat korvanneet layerit.
Ei tietenkään ole mikään pakko käyttää edes divejä vaan minkä tahansa elementin voi css:llä laittaa mihin tahansa paikkaan.
img {
position: absolute; /* vaihtoehdot: absolute | static | relative | fixed */
top: 50px; /* sijainti, voidaan ilmoittaa myös prosentteina tai muilla yksiköillä */
left: 100px;
z-index: 10; /* ilmoittaa järjestyksen jos useampia elementtejä on päällekkäin; isompi numero on ylempänä */
}