Question

我是jQuery的新手，当你将鼠标悬停在某个<div>（#onefourth）background-image #bottomleftjunk切换到<时，我正试图这样做EM> 'junk1.png'的。问题是当我将鼠标悬停在div上时，它只会使当前的背景图像消失而不是将其切换到新的背景图像。

$('#onefourth').hover(
    function()
    {
        $('#bottomleftjunk').css("background-image", "url(junk1.png)");
    }, 
    function()
    {
        $('#bottomleftjunk').css("background-image", "url(junk1.png)");
    }
);

如果有人有任何想法，我真的很感激帮助，谢谢！

Answer 1

您指的是同一张图片。请更正并尝试以下代码。

$(document).ready(function () {
                $("#onefourth").hover(function () {
                    $('#bottomleftjunk').attr("src", "junk1.jpg");
                }, function () {
                    $('#bottomleftjunk').attr("src", "junk2.jpg");
                }
                });
            });

Answer 2

正在删除背景，因此您可以确定一件事：您的JavaScript正在运行。这意味着它几乎肯定是文件路径问题。在jQuery中调用css()将编辑元素的内联样式，这意味着路径必须相对于HTML文档。

以此结构为例：

root
 |-index.html
 |
 |-scripts
 |  |-javascript.js
 |  |-css.css
 |
 |-images
 |  |-junk1.jpg
 |  |-otherimages.jpg

相对于index.html，'junk1.jpg'的路径为：images/junk1.jpg

Jquery背景图像更改只会使当前图像消失

2 个答案: