链接翻转时DIV背景图像交换

Question

I'm trying to swap out the background image on a div when the user rolls over a link. 当用户将鼠标悬停在链接上时，我正在尝试换掉div上的背景图像。

What am I doing wrong? 我究竟做错了什么？ This isn't working. 这不起作用。

<style>
#divToSwap {
    background-image: url(black.jpg);
    height: 150px;
    width: 150px;
}
</style>
</head>

<body>
<div id="divToSwap"></div>
<div>
<ul>
  <li><a href="#"
        onmouseover="document.getElementById('divToSwap').backgroundImage='url(red.jpg)';"
        onmouseout="document.getElementById('divToSwap').backgroundImage='url(black.jpg)';">
        Red</a></li>
  <li><a href="#"
        onmouseover="document.getElementById('divToSwap').backgroundImage='url(blue.jpg)';"
        onmouseout="document.getElementById('divToSwap').backgroundImage='url(black.jpg)';">
        Blue</a></li>
  <li><a href="#"
        onmouseover="document.getElementById('divToSwap').backgroundImage='url(green.jpg)';"
        onmouseout="document.getElementById('divToSwap').backgroundImage='url(black.jpg)';">
        Green</a></li>        
</ul>
</div>

Answer 1

尝试，例如

document.getElementById('divToSwap').style.backgroundImage='url(black.jpg)';

Answer 2

Use 采用

document.getElementById('divToSwap').style.backgroundImage=...

instead of 代替

document.getElementById('divToSwap').backgroundImage=....

Answer 3

.style丢失：

onmouseover="document.getElementById('divToSwap').style.backgroundImage='url(red.jpg)';"

链接翻转时DIV背景图像交换

问题描述

3 个解决方案

解决方案1
0 2013-11-18 14:25:31

解决方案2
0 2013-11-18 14:25:59

解决方案3
0 2013-11-18 14:33:20

链接翻转时DIV背景图像交换

问题描述

3 个解决方案

解决方案1 0 2013-11-18 14:25:31

解决方案2 0 2013-11-18 14:25:59

解决方案3 0 2013-11-18 14:33:20

解决方案1
0 2013-11-18 14:25:31

解决方案2
0 2013-11-18 14:25:59

解决方案3
0 2013-11-18 14:33:20