jquery - jQuery 中的动画伪类

Question

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

我的 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});

谁能看到我遗漏的东西？

Answer 1

jQuery UI提供这样一个function这将使元素从一个类动画化到另一个类

$(".gallery a").mouseover(function(){  
  $(this).switchClass('newClass', 'anotherNewClass', 1000);
})