Question

我想使用jQuery在鼠标位于不同的div上时更改一个div的背景图像。

＆＃13;

jQuery(function() {
  jQuery('.linktomouseover').mouseover(function() {
    $(.linktomouseover2).css('background-image', "url('test.jpg')");
  });
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<div class="linktomouseover">
  <a class="nthn">link1</a>
</div>
<div class="linktomouseover2">
  <a class="test">link2</a>
</div>

＆＃13;

因此当鼠标超过div linktomouseover时，它实际上会改变div的背景linktomouseover2

这似乎不起作用。请帮忙吗？

Answer 1

您在代码jQuery(.linktomouseover)

中缺少引号

这是正确的代码

jQuery(function() {
    jQuery(".linktomouseover").mouseover(function() {
        jQuery(".linktomouseover2").css('background-image', "url('test.jpg')");
    });
});

<强> DEMO

Answer 2

这是您的代码错误。

<强> jQuery的：

jQuery('.linktomouseover2').mouseover(function() {
        $('.linktomouseover').css('background-image', "url('http://cdn.androidpolice.com/wp-content/uploads/2012/11/nexusae0_wallpaper_01.jpg')");
    });

<强> HTML：

<div class="linktomouseover">
    <a class="nthn">link1</a>
</div>
<div class="linktomouseover2">
    <a class="test">link2</a>
</div>

<强> CSS：

.linktomouseover{
    position:relative;
    display:block;
    width:100%;
    background:#e7e7e7;
    height:200px;
}
.linktomouseover2{
    position:relative;
    display:block;
    width:100%;
    background:#d7d7d7;
    height:200px;
}

当鼠标位于不同的div上时，更改一个div的背景图像

2 个答案:

Live Demo On JSFiddle