在鼠标上方插入图像并将鼠标移出

时间:2012-04-14 03:22:17

标签: javascript html onmouseover onmouseout

我在div中有一个图像,我试图在鼠标结束时进行更改,然后在鼠标移出时恢复。但是我很难在鼠标输出时将图像插入div。是一种特殊的方式来处理这个或另一个消息。问题似乎是在HTML插入中放置斜杠。

  <div class='myImage' onmouseout='this.innerHTML = '<img src='./images/myImage.jpg' />' onmouseover='this.innerHTML = \"\"; this.style.backgroundColor = \"#1D4088\"' style='height:100px; width:100px'><image src='./images/myImage.jpg'></div>

2 个答案:

答案 0 :(得分:2)

嗯,好像你过于复杂,不用担心。

尝试按照“写”教程。

Here's 一个好的:

如果你真的想进入它:http://css-tricks.com/css-sprites/

答案 1 :(得分:1)

我认为您的双引号和单引号有点冲突,请尝试将javascript放入函数中

<div class="myImage" onmouseout="toggle(this,'1')" onmouseover="toggle(this,'2')" style="height:100px; width:100px"><image src="./images/myImage.jpg"></div>

和javascript

function toggle(e,a) {
    if(a=='2') {
        e.innerHTML = '';
        e.style.backgroundColor = '#1D4088';
    } else {
        e.innerHTML = '<img src="./images/myImage.jpg" />';
        e.style.backgroundColor = '';
    }
}