Javascript Jquery显示/隐藏DIV并在显示时使其闪烁

我正在创建一个默认隐藏的div，当我单击一个链接时，它会显示一个警告div，这很好，但我希望div也会闪烁

这是我的

显示div的文本链接

<a class="buttons" href="#" onclick="show(this)">join us</a>

现在，单击上面的链接时显示隐藏的div

<div id="warning" style="display:none;">SHOW THIS DIV ...</div>

显示此分区。。。

现在是JQuery脚本

<script>
    function show(x){
        $('#warning').show();
        setInterval(blink, 100);
    };

</script>

功能展示（x）{
$（“#警告”）.show（）；
设置间隔（闪烁，100）；
};

问题是，当我点击链接时，div开始隐藏，它显示div，但不闪烁。。。如何使它在显示时闪烁？

例如：

$('#warning').blink();

---

嘿，为什么不需要Jquery切换函数呢？

功能显示（x）{
设置间隔（切换，100）；
};
函数切换（）{
$（“#警告”）.toggle（）
}

显示此分区…

我不知道“闪烁”是什么意思，但这里有一个关于如何制作任何你想要的东西的想法：

function show(x){
    var $warning = $('#warning');
    $warning.show();
    setInterval(function(){

       if (!$warning.data('red')) { //if it's not red, make it red

          $warning.css('background-color', 'red');
          $warning.data('red', true);
       } else { //if it's red, make it transparent

          $warning.css('background-color', 'transparent');
          $warning.data('red', null);
       }
    }, 500);
};

---

在您的示例中，显示div，但不要隐藏以闪烁。 您可以使用jquery.delay（）来产生闪烁效果

<script> 
   function show(x){ 
      $('#warning').show().delay(500).hide();
     setTimeout(show, 500); 
  }; 

函数show（x）{
$（'#warning'）.show（）.delay（500.hide（）；
设置超时（显示，500）；
}; 

---

此解决方案依赖于附加的jQuery UI库：

$（'.buttons'）。在（'click'，function（）上{
$（“#警告”）。效果（“脉动”，1000，函数（）{
$（this.show（）；
});
});

显示这个DIV…
因为我喜欢CSS3解决方案而不是js动画，下面是我的示例如何解决它。它不会适用于所有浏览器，但对于这种类型的动画来说，它仍然是一个小问题


功能显示（x）{
$（'警告'）.addClass（'显示'）；
};
@关键帧示例{
0%{不透明度：1；}
25%{不透明度：0；}
50%{不透明度：1；}
75%{不透明度：0；}
100%{不透明度：1；}
}
#警告{
位置：绝对位置；
顶部：-20000px；
左：-20000px；
不透明度：0；
}
#警告。显示{
位置：静态；
动画：示例1s线性250ms；
不透明度：1；
}

显示此DIV…
您可以通过删除计时器和使用fadein/out来更改显示功能：

    function show(x){
        $('#warning').show().fadeOut(100, function(){
            $(this).fadeIn(100, function(){
                show(this);
            });
        });
    };

片段：


功能显示（x）{
$（“#警告”）.show（）.fadeOut（100，函数（）{
$（this）.fadeIn（100，function（）{
展示（这个）；
});
});
};
功能停止（x）{
$（“#警告”）.stop（）；
}

显示此DIV…
闪烁是什么意思？改变背景？边框？可以试试这个$（this.effect（“highlight”{}，3000）；