Question

我目前正在尝试使用图片地图替换图片。第一个图像被第二个图像替换，但是我没有运气让第三个图像替换第二个图像。

的javascript：

    <script>
        dcoument.getElementById("img1").src="MSWORD.jpg";
        document.getElementById("img2").src="ClickFile.png";
        documnet.getElementById("img3").src="NewFile.png"

        function replaceImage(imgid, source, mapid)
        {
          var image = document.getElementById(imgid);
          image.src= source;
          var newmap = document.getElementById(mapid);
          var origin = document.getElementById("ClickFile");
          origin.innerHTML = newmap.innerHTML;
        }
    </script>

Html5的

                <img id="img1" src="MSWORD.jpg" alt="Microsoft Word"
                style="width:fill-available;height:fill-available" usemap="#ClickFile"> 

                 <map name="ClickFile">

                 <area href="javascript:(function(){
                    document.getElementById('img1').src='ClickFile.png';})()"
                    shape="rect" coords="58,50,0,25">
                 </map>    

                 <map name="image1" id="image1">
                    <area href="javascript:replaceImage('img1', 'ClickFile.png', 'img2')"
                      shape="rect" coords="50,58,0,25">
                </map>

                <area href="javascript:(function(){
                    document.getElementById('img2').src='NewFile.png';})()"
                    shape="rect" coords="122,103,0,141">

                <map name="image2" id="image2">
                    <area href="javascript:replaceImage('img2', 'Newfile.png', 'img3')"
                    shape="rect" coords="122,103,0,141">   
                </map>

Answer 1

不确定这是否是问题，但要确保</map>标记位于其中的<area …>标记之后。现在，您的第二张和第三张地图位于第一张地图内，这可能会让浏览器感到困惑。

使用图像映射使新图像替换旧图像

1 个答案: