在鼠标悬停时更改一个后退菜单项的背景图像答案

【问题标题】：change the background image of one back menu item on mouse hover在鼠标悬停时更改一个后退菜单项的背景图像
【发布时间】：2013-04-04 06:53:38
【问题描述】：

我正在处理一个菜单及其面包屑样式菜单，我想要做的是当我将鼠标悬停在任何菜单项上时，悬停时会发生相应的变化，我还想更改最近的菜单项的背景图像（我将鼠标悬停在菜单项之前的那个）。可能吗？？如果是，请将相关链接发送给我。我自我搜索了很多但失败了。如果通过 jquery 或 css 可能，请告诉我并发给我链接

我的声誉低于 10，所以我无法上传图片。

【问题讨论】：

是的……除非您发布一些代码……您的声誉不会阻止您发布您的代码或您迄今为止所做的事情，至少是 HTML
很好，你是对的，但我的代码不会描述我想问的问题我的问题很简单
看看这个 js fiddel jsfiddle.net/rGFzJ 当点击菜单项时它会改变整个身体的背景，但我想做的是改变最近的菜单项的背景图像，比如点击第三项它也应该改变第二项的背景，当点击第二项时它应该改变第一项的背景
hmmm.. 但是请参阅帮助您，我们需要在这里重新创建所有内容.. HTML，jquery，CSS（+ 假设我们正在创建，就是您正在寻找的内容）...大多数看到你的帖子的人一看到这里没有任何东西（代码）就会离开..
是的..看看小提琴是需要的......你应该把它添加到你的问题中...... :)

标签： jquery css

【解决方案1】：

检查这个 jQuery sn-p 是否对您有帮助：

$('.menu li a').hover(
    function() { $(this).parent().prev().find('a').css('background-image', 'url(new-bg.png)') },
    function() { $(this).parent().prev().find('a').css('background-image', 'url(old-bg.png)') }
);

【讨论】：

【解决方案2】：

使用eq() 获取之前的li 并使用css() 更改背景颜色

试试这个

  $("a").hover(function(e) {
    e.preventDefault();
    var i = $("li").index( $(this).parent() );

    if ( i === 1 ) {
       $('li').eq(i-1).css({"background-color":"red"}); 
       $('body').css('background', 'beige');
    } else if ( i === 2 ) {
       $('li').eq(i-1).css({"background-color":"blue"});
       $('body').css('background', 'honeydew');
    } else {
       $('li').eq(i-1).css({"background-color":"green"});
       $('body').css('background', 'pink');
    }
  },function(e){
      var i = $("li").index( $(this).parent() );
      $('li').eq(i-1).css({"background-color":"transparent"});
  });

working fiddle

【讨论】：