Question

当用户将鼠标悬停在“研究”，“品牌策略”，“受众群体参与”等项目之一时，底部的背景颜色会通过内联样式进行更改。

http://www.odopod.com/work/tags/strategy/

我想知道它是如何完成的或者他们使用的是哪个Jquery插件？

非常感谢！

Answer 1

这不是一个插件，这是通过良好的旧简单jQuery完成的：

<div class='something'>my text goes here blah blah blah</div>
<div class='somethingelse'>my background color goes here</div>

然后使用jQuery：

$(function() {
    $('div.something').hover(function() {
        $(this).next('div.somethingelse').css('background-color','red');
    }, function() {
        $(this).next('div.somethingelse').css('background-color','blue');
    });
});

根据您的需要，您可以通过多种不同的方式设置HTML。然后，您将使用适当的DOM traversing函数来查找关联的DIV并相应地操作它的CSS。

Answer 2

要使用jQuery为背景颜色设置动画，请使用color plugin。

Answer 3

这不是插件：

// global nav effect
$('#global_header li').hover(function(){
  $('div.marker',$(this)).animate({height:3}, 90)
},function(){
  if(false == $(this).hasClass('active'))
  {
    $('div.marker',$(this)).animate({height:0}, 90)
  }
})

$('#global_header li').click(function(){
  $('div.marker',$(this)).addclass('active')
})

就是这样。它使用hover（）和animate（）。

好的，所以这是全局标题的脚本，但它大致相同，只影响另一个。

这是什么Jquery插件？

3 个答案: