jQuery脉冲问题

我用了一点詹姆斯·帕多尔西的妙笔。它提供了pulse功能，而无需链接到jQuery UI，这对我来说非常好，因为我已经链接了jQuery，如果不需要的话，我不想再使用另一套工具

我的问题是，是否可能只有焦点边界脉冲，而不是整个元素。在当前的实现中，整个元素都会脉冲，但我只希望焦点边框可以脉冲，如果可能的话，只有当边框可见时（即，用户已切换到链接）

提前感谢,

亚伦·乔文

编辑：演示我的dilema的测试页面

编辑：好吧，我想我应该换个方式问这个问题。。。我当前的实现引用了类为“link”和“piclink”的元素。是否可以具体引用焦点边界

---

编辑：我发现一些JS允许在样式表中操纵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);
           }
       }
    );
}

这里有一个简单的例子。单击按钮设置焦点，这将启动动画，然后单击页面上的其他位置，使其失去焦点并停止动画

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

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

---

希望从这里开始，您可以调整它以满足您的需要，因为它不会直接回答您的问题（对不起！）。

如果您没有充分利用Jquery UI提供的所有功能，那么您就真的错过了。只有按钮和鼠标器才是加载库的理由。我知道你从哪里来，但在我的网站上，我没有利用任何这些功能，所以……你的问题到处都是。如果您将代码示例发布到jsfiddle.net，这可能会帮助我们查看第一次编辑中链接的测试页面。。。在该页面上，所有类为“link”或“piclink”的元素都会脉冲。我只想让焦点边框跳动，如果可能的话，只有当焦点边框可见时（用户点击链接）。谢谢，这就是我所说的内容！我将调整它以改变不透明度而不是边框的宽度（如果可能的话），并报告我的发现。顺便说一句，我以前见过这种类型的代码，但从来都不知道到底发生了什么：“（px>0）？0:5）“很明显，这是一个有条件的stmt，但是”？“0:5”在做什么？我不认为outline有不透明属性——如果你真的想走这条路，你需要在元素后面做另一个，只显示它（并闪烁它）在焦点上，并将其更改为隐藏在联合国焦点上。（）？：是第三级语句。基本上，它在parens中计算内容，如果它为真，则在：，false的左侧计算，在右侧计算。因此，在这种情况下，如果px大于0，则发送0，否则发送5。太棒了，非常感谢您的指示！我想使用outline属性，因为它不会干扰页面的流，而border属性会。有没有一种方法可以使边界不偏离流？没有可靠的跨浏览器没有。。。我见过的大多数网站都有类似的效果（比如光晕效果），都会在焦点/鼠标悬停时显示隐藏的div。对于如何做到这一点，我会搜索CSS相对布局或如何使用相对来定位后面的元素-您必须担心z索引、透明度和其他问题，完整的答案会解决这些问题；你不会得到很多

border

可以做的事情（比如圆角），但它可以在（AFAIK）每个浏览器上工作。更现代的方法是使用

框阴影

，它可以让你做的远不止是一个实体边框，但只有最新的浏览器支持它。