kysyisin mielipidettänne miten kannattaisi toteuttaaa seuraavanlainen juttu:
minulla on kuvakartta, jossa on merkittyjä alueita ja näistä alueista avautuu määritelty kuva. tässä ei sinänsä mitään ihmeellistä. haluaisin kuitenkin niin, että kuvakartasta avautuva kuva aukeaa kuvakarttasivun päälle eikä omalle erilliselle sivulleen.
googlella löytyy joitakin javascript-versioita, joilla voisi tämän ehkä toteuttaa, mutta se javascript?
en ole löytänyt ohjeita netistä siitä, miten kuvakarttaan itseensä voisi liittää efektejä linkkikuvan avaamiseen (kuvan laajentaminen tms...).
mitä mieltä olette ja miten kannattaisi toteuttaa?
En ihan tarkkaan ymmärtänyt että mitä olet hakemassa. Et siis hae mitään efektejä itse imagemappiin, vaan pelkästään haluat avata linkeistä kuvat nykyisen sivun päälle?
Eli joku Lightbox tyyppinen javascripti olisi sopiva valinta? Katso googlesta esimerkkejä haulla "Lightbox", jos tätä tarkoitat.
Minäkään en ihan ymmärrä kysymystä ja tavoitetta (URL olisi kiva), mutta eikös lähtökohdaksi kannata ottaa ihan client-side imagemap, jossa ei tarvita mitään ohjelmointia (vain map- ja area-elementtejä, joiden rakenteluun on kyllä kiva käyttää jotain ohjelmaa, mutta niitähän löytyy)? Siis olettaen, että halutaan vain tehdä kuvan alueista linkkejä. Ja silloinhan linkit oletusarvoisesti avautuvat siihen ikkunaan, jossa ollaan.
Mutta mitä efektejä tässä halutaan, ja mitä esimerkiksi kuvan laajentaminen tarkoittaa? Kyllähän alueen klikkaamiseen voidaan liittää tapahtumia, jotka käsitellään Javascriptillä, mutta mitä tässä ajetaan takaa?
Moikka volume!
voisit käyttää vaikkapa ikkunatonta popup'ia...(yksinkertainen esimerkki)
<html><head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<title>testpage</title>
<style type="text/css">
#popup
{
position: absolute;
top: 25%;
left: 25%;
display: none;
background: #FFF;
width: 1px;
height: 1px;
}
</style>
<script language="javascript">
function large_area_show(index)
{
var image = "osakuva" + index + ".jpg";
var popup = document.getElementById("popup");
popup.innerHTML = "<img src='" +
image + "' onclick='popup_hide();'/>"
popup_show();
}
function popup_show()
{
var popup = document.getElementById("popup");
popup.style.display = "block";
}
function popup_hide()
{
var popup = document.getElementById("popup");
popup.innerHTML = "";
popup.style.display = "none";
}
</script></head><body>
<div id="popup"></div>
<table border="1" width="100%" id="table1" background="kokokuva.jpg"
height="100%" cellspacing="1" style="border-collapse: collapse">
<tr>
<td onclick="large_area_show(1)"> </td>
<td onclick="large_area_show(2)"> </td>
<td onclick="large_area_show(3)"> </td>
<td onclick="large_area_show(4)"> </td>
</tr>
<tr>
<td onclick="large_area_show(5)"> </td>
<td onclick="large_area_show(6)"> </td>
<td onclick="large_area_show(7)"> </td>
<td onclick="large_area_show(8)"> </td>
</tr>
<tr>
<td onclick="large_area_show(9)"> </td>
<td onclick="large_area_show(10)"> </td>
<td onclick="large_area_show(11)"> </td>
<td onclick="large_area_show(12)"> </td>
</tr>
<tr>
<td onclick="large_area_show(13)"> </td>
<td onclick="large_area_show(14)"> </td>
<td onclick="large_area_show(15)"> </td>
<td onclick="large_area_show(16)"> </td>
</tr>
</table>
</body></html>makumaku kirjoitti:
En ihan tarkkaan ymmärtänyt että mitä olet hakemassa. Et siis hae mitään efektejä itse imagemappiin, vaan pelkästään haluat avata linkeistä kuvat nykyisen sivun päälle?
Eli joku Lightbox tyyppinen javascripti olisi sopiva valinta? Katso googlesta esimerkkejä haulla "Lightbox", jos tätä tarkoitat.
yksi mahdollisuus näyttää olevan se, että käyttää Lighbox:ia ja sitten div-elementtiä kuvien asemoinnissa "kuvakartan" päälle. Lightbox-avaa suuret kuvat kauniisti ja div-elementti antaa mahdollisuuden eri tumb-kuvien sijoittamiseen halutulle kohdalle "kuvakarttapohjaa".
tänks...
Aihe on jo aika vanha, joten et voi enää vastata siihen.