Question

我正在使用James Padolsey精彩modified version的pulse plug-in。它提供了脉冲功能而无需链接到jQuery-UI，这对我来说非常棒，因为我已经连接了jQuery，如果我不需要那么就不想打扰另一套工具......

我的问题是，是否可能只有焦点边界脉冲，而不是整个元素。在当前实现中，整个元素都会发出脉冲，但是我只希望聚焦边框这样做，如果可能的话，只有当边框可见时（即用户已经选中了链接）。

提前致谢，

Aaron Chauvin

编辑：Here's一个测试页面，以展示我的困境

编辑编辑：好的，我想我应该以不同的方式提出这个问题...我当前的实现引用了带有“link”＆amp;类的元素。 “piclink”。是否可以专门引用焦点边界？

编辑编辑编辑：我发现了一些允许在样式表中处理CSS规则的JS functions ...我将尝试将这些与上面修改过的插件结合使用实现我的目标。我将根据我的发现进行更新。

Answer 1

虽然我没有看插件，但希望这个小片段对你自己的解决方案有所帮助：

鉴于此css：

.blinky {
    background-color:blue;
    color:white;
    outline-width:5px;
    outline-style:solid;
    outline-color:green;
}

你可以这样写：

// in on ready
$('.blinky').focus(function(){
   $(this).animate({
    'outline-width': '0px'
   }, 500, function() {
      animateBorder(this,5);
   });
});
// elsewhere
function animateBorder(context,px)
{
    $(context).animate({
        'outline-width': px+'px'
       }, 500, function() {
           // make sure its still focused before calling again
           if(this===document.activeElement){
               animateBorder(context,(px>0)?0:5);
           }
       }
    );
}

这是一个简单的jsfiddle example。单击按钮设置焦点，开始动画，然后单击页面上的其他位置，使其失去焦点并停止动画。

基本上，它只是将轮廓边框的大小从给定量设置为0，然后返回。

然后递归调用相同的animate函数，使其保持连续循环。但是，在每次递归调用之前，它会检查以确保该元素仍然是活动元素。

希望从这里你可以调整这个以适合你的需要，因为它没有直接回答你的问题（对不起！）。

jQuery脉冲问题

1 个答案: