0

这是我当前的代码:

<html>
<head>
<title>Imagemap</title>
<script>
    function swapImageIn(id){
    document.getElementById(id).src='\\C:\Users\idb\Desktop\Websitefinal\usa.png';
    }
    function swapImageOut(id){
    document.getElementById(id).src='\\C:\Users\idb\Desktop\Websitefinal\worldmap_load.png';
    }
</script>
</head>
<body>

<div>
   <img src="\\C:\Users\idb\Desktop\Websitefinal\worldmap_load.png" id="main" alt="" usemap="#worldmap_load" style="border-style:none" />
</div>

<div>
<map id="worldmap_load" name="worldmap_load">
<area shape="poly" alt="USA" coords="77,49,109,23,86,11,0,34,0,78" nohref="nohref" title="USA" onMouseOver="swapImageIn('main')" onmouseout="swapImageOut('main')" />
</map>
</div>

</body>
</html>

我正在尝试让 mouseover 事件和 mouseout 事件起作用。他们目前不工作。有什么建议么?

编辑 - 当地图区域被鼠标悬停时,我想要改变图像。但是,永远不会到达事件“onMouseOver”。

4

3 回答 3

1

这在这里有效。我认为这是文件路径的问题。(使用正斜杠)

<!DOCTYPE html>
<html>
<head>
<script>
function swapImageIn(tgtIdStr)
{
    document.getElementById(tgtIdStr).src = "C:/xampp/htdocs/enhzflep/img/img1.png";
}
function swapImageOut(tgtIdStr)
{
    document.getElementById(tgtIdStr).src = "C:/xampp/htdocs/enhzflep/img/img2.png";
}

</script>
</head>
<body>
    <div>
       <img src="file.png" width='200' height='200' id="main" alt="" usemap="#worldmap_load" style="border-style:none" />
    </div>

    <div>
        <map id="worldmap_load" name="worldmap_load">
        <area shape="poly" alt="USA" coords="77,49,109,23,86,11,0,34,0,78" title="USA" onmouseover="swapImageIn('main')" onmouseout="swapImageOut('main')" />
        </map>
    </div>
</body>
</html>
于 2012-10-01T03:26:59.000 回答
0

你需要:

function swapImageIn(id){
    return function() {
    document.getElementById(id).src='\\C:\Users\idb\Desktop\Websitefinal\usa.png';
    }
}
function swapImageOut(id){
    return function() {
    document.getElementById(id).src='\\C:\Users\idb\Desktop\Websitefinal\worldmap_load.png';
    }
}

并且onmouseout应该是onMouseOut

于 2012-10-01T03:05:52.543 回答
0

试试这个代码:

<script>
    function swapImageIn(id){
    document.getElementById(id).src='C:/Users/idb/Desktop/Websitefinal/usa.png';
    }
    function swapImageOut(id){
    document.getElementById(id).src='C:/Users/idb/Desktop/Websitefinal/worldmap_load.png';
    }
</script>

使用这个新的。

问候

于 2012-10-01T03:11:24.773 回答