|
Možeš koristiti <area> tag. Samo definiši koordinate koje ograničavaju laticu i postavi joj neku klasu ili jedinstvene ID-eve ako imaš par latica i definiši event handler za svaki.
HTML
<map name="cvet">
<!-- vidi šta ti više paše; rect (kvadrat) ili circle (krug) da graniči laticu -->
<area id="latica1" shape="rect" coords="{koordinate prve latice}">
<area id="latica2" shape="circle" coords="{koordinate druge latice}">
</map>
<img usemap="#cvet" src="{link do slike}">
JavaScript
document.getElementById("latica1").addEventListener("click", {
// otvori polje
});
document.getElementById("latica2").addEventListener("click", {
// otvori polje
});
Ako koristiš identičnu funkciju za više latica, onda je napiši i prosledi je kao parametar.
function otvoriPolje() {
// sadržaj funkcije
}
document.getElementById("latica1").addEventListener("click", otvoriPolje);
document.getElementById("latica2").addEventListener("click", otvoriPolje);
|
