0

是否可以在激活伪类时对其进行动画处理，例如：

我的css中必须有以下内容：

#gallery a span {
    border:#006553 3px solid;
    position:relative;
    overflow:hidden;
    display:block;
    top:0px;
    left:0px;
    height:89px;
    width:89px;
}

#gallery a:hover span {
    border:#f3bd2f 6px solid;
    position:relative;
    overflow:hidden;
    display:block;
    top:0px;
    left:0px;
    height:83px;
    width:83px;
}

我想在用户将鼠标悬停在链接上时为转换设置动画，即跨度边框必须增长。

如果这是可能的，有人吗？

提前致谢。

// 编辑：

我查看了'animateToSelector' jQuery插件，并使用了以下jQuery函数调用，但是没有动画，边框只是在上面指定的样式之间跳转。

这是我的函数调用：

$("#gallery a span").animateToSelector({selectors: ["#gallery a:hover span"], properties: ['border'], events: ['mouseover','mouseout'], duration: 3000});

谁能看到我缺少的东西？

4

3 回答 3

3

James Paolsey 的这篇文章可能会帮助您实现这样的转变。

于 2009-07-24T13:00:11.800 回答
1

jQuery UI提供了这样一个函数，它将一个元素从一个类动画化到另一个类

$(".gallery a").mouseover(function(){  
  $(this).switchClass('newClass', 'anotherNewClass', 1000);
})
于 2009-07-24T13:04:49.540 回答
0

为什么不只是在 mouseover 上绑定动画？

$("#gallery a").mouseover(function(){
  var span = $(this).children("span");
  //animate something on the span
});
于 2009-07-24T13:00:04.127 回答