在悬停时更改每个孩子的父背景图像/颜色答案

【问题标题】：Change the parent background-image/color for each child on hover在悬停时更改每个孩子的父背景图像/颜色
【发布时间】：2014-01-19 02:39:41
【问题描述】：

我希望我的父 div 根据悬停的女巫子 div 更改背景颜色/图像。我需要 4 个不同的子 div 来影响父级。

<div id="container">
    <div id="Div1" class="elmt">div1</div>
    <div id="Div2" class="elmt">div2</div>
    <div id="Div3" class="elmt">div3</div>
    <div id="Div4" class="elmt">div4</div>
</div>

小小提琴测试（不工作-_-'）http://jsfiddle.net/TyL6G/3/

【问题讨论】：

标签： javascript jquery css

【解决方案1】：

这是一个specificity 问题。 .newColor 类背景颜色不会覆盖 #container 背景颜色，因为 id 比类更具体。

使用更具体的选择器来应用背景：

#container.newColor {
    background-color:yellow;
}

UPDATED EXAMPLE

【讨论】：

【解决方案2】：

这是我的动态标签解决方案。如果你找到更好的方法，欢迎分享。 :)

jQuery

$(function() {
$('#container>div[image]').hover( function(){
  $(this).parent().css("background-image",$(this).attr("image"));
   },
   function(){
      $(this).parent().css('background-image','url(link.jpg)');
   });
});

检查小提琴： http://jsfiddle.net/TyL6G/15/

【讨论】：