javascript - Using same image map on multiple images but with a different link for each area on each image -
i trying use multiple images using image map "imagetilemap".
<map name="imagetilemap"> <area id="quiz"shape="circle" coords="41,193,20" href=""> <area id="video"shape="circle" coords="112,193,20" href=""> <area id="presentation"shape="circle" coords="184,193,20" href=""> </map>
and using javascript each area links anchor on separate page, page being dependent on image itself. function is:
<script type="text/javascript"> function changelink(clicked_href) { var url = clicked_href; var areaquiz = document.getelementbyid("quiz"); areaquiz.href = url + "#quiz"; var areavideo = document.getelementbyid("video"); areavideo.href = url + "#video"; var areapresentation = document.getelementbyid("presentation"); areapresentation.href = url + "#presentation"; } </script>
and first image set so:
<a id="firstimage" href="linkedpage1.html"><img src="image1.png" usemap="#imagetilemap" onclick="changelink(this.href)"/></a>
the second image formatted as:
<a id="secondimage" href="linkedpage2.html"><img src="image2.png" usemap="#imagetilemap" onclick="changelink(this.href)"/></a>
the problem have clicking on <area> on first image directs me towards anchor of second image's href. how can change changelink function correctly collect correct href? grateful response.
everything remain same ,,, change image code....href set same page clicked
change first image code to:
<a id="firstimage" href="linkedpage2.html"><img src="image1.png" usemap="#imagetilemap" onclick="changelink(this.href)"/></a>
do same first:
<a id="secondimage" href="linkedpage1.html"><img src="image2.png" usemap="#imagetilemap" onclick="changelink(this.href)"/></a>
Comments
Post a Comment