CSS闪耀效果 - 定时

Question

我正在处理一个可以激活或停用的按钮.当它被激活时,我希望每五秒左右发光一次.我一直在看这个小提琴

http://jsfiddle.net/AntonTrollback/nqQc7/

并尝试重新设计它,以便我的按钮周围的div将与类"图标效果"切换,创建闪耀效果,然后在大约一秒后切换,然后它将每五秒钟执行一次.我编辑了小提琴来创建div

<div id = 'my_button_div>
<div>

从本质上讲,它给出了制作红色盒子的各种属性.然后,我离开了图标效果类,因为fidde有它,并运行了一个时间函数

setInterval(function () {
                $('#my_ button_div').toggleClass('icon-effect');
                setTimeout(function () {
                     $('#my_ button_div').toggleClass('icon-effect');
                }, 1000);
            }, 5000);

这是小提琴

http://jsfiddle.net/nqQc7/286/

但我似乎无法让它发挥作用.我把悬停的东西留在那里,但它应该在那些分配的时间触发闪耀效果.

Answer 1

您发布的jsFiddle有几个问题:

1. 它不是导入jQuery,这意味着$不会被定义
2. 您在icon-effect实际元素上切换类,但它应该在子元素上
3. 在JavaScript中引用时,实际元素的id中有一个空格
4. 的.icon-effect子元素被从单独定义#my_button_div元件(它需要在其内部)

这是一个固定的jsFiddle:http://jsfiddle.net/nqQc7/289/