码迷,mamicode.com
首页 > Web开发 > 详细

js实现元素边框闪烁功能

时间:2015-03-04 18:31:05      阅读:140      评论:0      收藏:0      [点我收藏+]

标签:

<body>
  <input type="text" value="test" onclick="flash(this)">
 </body>
 <script>
 function flash(elem){
    var elem = typeof elem === ‘string‘ ? document.getElementById(elem) : elem, // 参数可接收id或者元素本身
        borderColor = elem.style.borderColor
    elem.style.borderColor = borderColor == ‘red‘ ? elem.borderColor : ‘red‘
    if (!elem.timer) {
        elem.times = 6
        elem.borderColor = borderColor // 保存元素原来的边栏样式
        elem.timer = setInterval(function() { flash(elem) }, 180) // 这里直接以元素当做参数, 提升执行效率
    } else {
        if (elem.times == 0) {
            clearInterval(elem.timer)
            elem.timer = null
        }
        elem.times--
    }
}
 
 </script>

 

js实现元素边框闪烁功能

标签:

原文地址:http://www.cnblogs.com/duwenlei/p/4313665.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!