Question

我基本上编写了自己的jQuery悬停效果插件，除了IE（9,8,7）之外，适用于所有浏览器....

以下是链接：http://www.fiver.org/web/testing 这是代码：

function go()
{

  hoverEffect = document.getElementsByName("hoverEffect");
  for (i=0; i<hoverEffect.length; i++)
  {
    $(hoverEffect[i]).bind('mouseenter', bMouseOver);
    $(hoverEffect[i]).bind('mouseleave', bMouseOut);
  }

  function bMouseOver(e)
  { 
    $(this).find(".fadebox")
      .animate({opacity: 1},
      300);                                         
  }


  function bMouseOut(e)
  { 
    $(this).find(".fadebox")
      .animate({opacity: 0},
      {duration: 'slow'});

  }


}

$(document).ready(function(){
    go();
});

这是一个基本的悬停效果，让我头晕目眩！你有什么想法???

最佳，

Answer 1

IE-s getElementsByName有一些问题，我不会依赖它。

尝试为这些元素提供一个类，而不是名称，并使用jQuery选择它们。

实施例

HTML：

<div class="hoverEffect">one</div>    
<div class="hoverEffect">two</div>
<div class="hoverEffect">three</div>

使用JQuery选择它们并分配事件：

$(".hoverEffect").bind('mouseenter', bMouseOver);
$(".hoverEffect").bind('mouseleave', bMouseOut);

这也将摆脱DOM的额外迭代和不必要的数组的使用（hoverEffect []）

Answer 2

尝试使用不透明度：.00而不是不透明度：0

当使用.00作为零不透明度而不是0时，jQuery不透明度动画效果更好。我无法解释并找到任何文档，为什么会这样，但它在过去修复了我的问题。

关于此脚本中不起作用的更多信息将有助于：）

jQuery悬停效果问题在Internet Explorer上

2 个答案: