Question

希望你能提供帮助，并且可以做到这一点......

这是HTML代码：

<div id="logo">
     <div id="drop1">
     </div>

     <div class="clear"></div>

     <div id="drop2">
     </div>

     <div id="drop3">
     </div>
</div>

<div id="words">
    <div id="a">
    </div>

    <div id="b">
    </div>

    <div id="c">
    </div>
</div>

<div id="logo">只有背景图片。

<div id="drop1">，<div id="drop2">和<div id="drop2">是透明的（显示边框以使其可见）。

div的'a'，'b'和'c'都有背景图片。

我需要做的是：当悬停'drop1'，'drop2'或'drop3' div时，div'logo'的背景img将与div'a'，'b'的背景img一起改变'C'。

所以，为了更清楚，如果我悬停div'drop1'：div'logo'，div'a'，div'b'和div'c'将更改背景图片。

一旦我对它不了解，我不确定它是否最好使用jQuery。

我希望我能很好地解释我的问题。

Answer 1

使用以下jquery代码

$('#drop1,#drop2,#drop3').hover(
  function(){
    $('#a').css({"background-color":"blue"});
    $('#b').css({"background-color":"red"});
    $('#c').css({"background-color":"green"});
    $('#logo').css({"background-color":"black"});
  },function(){
    //similarly give them their original backgrounds
});

如果你想将他们的背景更改为普通的背景，那么创建一个类new_background然后添加

$('#a,#b,#c,#logo').addClass("new_background");

如何在悬空空div时更改不同的div背景图像？

1 个答案: