JS按钮闪烁功能的实现代码

html

<body onload="blinklink()" onunload="stoptimer()">
  <a href="javascript:;" rel="external nofollow" class="iforeginbtn" id="flashit">马上注册领取</a>
</div>

js

var flashit=document.getElementById('flashit');
function blinklink(){
if(flashit.style.backgroundColor=='rgb(232, 83, 63)'){ //注意:这里拿到的是rgb格式的
  flashit.style.backgroundColor='#485fbd';
 }else{
   flashit.style.backgroundColor='rgb(232, 83, 63)';
 }
  timer=setTimeout("blinklink()",300);
}
function stoptimer(){
  clearTimeout(timer);
}

总结

以上所述是小编给大家介绍的JS按钮闪烁功能的实现代码,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对我们网站的支持!

(0)

相关推荐

  • JavaScript 平滑文字闪烁

    colors2 = new Array(6); colors2[0]="#fef4d9"; colors2[1]="#333300"; colors2[2]="#665500"; colors2[3]="#997700"; colors2[4]="#CC9900"; colors2[5]="#FFCC00"; var i=0; function fLi2() { line2.style.

  • AngularJS页面访问时出现页面闪烁问题的解决

    我们知道在应用的页面或者组件需要加载数据时,浏览器和angular渲染页面都需要消耗一定的时间.这里的间隔可能很小,甚至让人感觉不到区别:但也可能很长,这样会导致让我们的用户看到了没有被渲染过的页面. 这种情况被叫做Flash Of Unrendered Content (FOUC)(K)?and is always unwanted.下面我们将要介绍几个不同的方式防止这种情况发生在我们的用户身上. 1.ng-cloak ng-cloak指令是angular的内置指令,它的作用是隐藏所有被它包含

  • JS实现的网页背景闪电闪烁效果代码

    本文实例讲述了JS实现的网页背景闪电闪烁效果代码.分享给大家供大家参考,具体如下: 这款JavaScript特效代码可实现网页背景的闪电闪烁特效,点击网页上的按钮,即可激活效果,很炫的效果,细心的JS爱好者会发现,其实是把网页的背景颜色由"黑色"快速变换成"白色",形成了"闪电"效果. 在线演示地址如下: http://demo.jb51.net/js/2015/js-lightning-style-bgcolor-demo/ 具体代码如下: &

  • 无闪烁更新网页内容JS实现

    todo list 无闪烁更新网页的课题比较大. 加载的html字符串(通过ajax获取的),如果还需要运行代码,那么肯定有问题. 希望用一个不显示的iframe来承载这个对象.这有点dirty work的感觉. 最终解决方案是 复制代码 代码如下: var str2DOMElement = function(html) {    var frame = document.createElement('iframe');    frame.style.display = 'none';    d

  • js实现文字闪烁特效的方法

    本文实例讲述了基于jquery实现省市联动特效的代码,分享给大家供大家参考,具体如下: 运行效果图: 实现原理:使用style对象来设置css属性,结合定时器就可以实现js实现文字闪烁特效. 具体代码如下 <html> <head> <meta charset="gb2312" /> <title>js实现文字闪烁特效</title> </head> <script> var flag = 0; fun

  • JS+CSS实现闪烁字体效果代码

    本文实例讲述了JS+CSS实现闪烁字体效果的方法.分享给大家供大家参考,具体如下: <div id="blink">闪烁的文字</div> <script language="javascript"> function changeColor(){ var color="#f00|#0f0|#00f|#880|#808|#088|yellow|green|blue|gray"; color=color.spli

  • vuejs在解析时出现闪烁的原因及防止闪烁的方法

    原因: 在使用vuejs.angularjs开发时,经常会遇见在如Chrome这类能够快速解析的浏览器上出现表达式({{ express }} ),或者是模块(div)的闪烁.对于这个问题由于JavaScript去操作DOM,都会等待DOM加载完成(DOM ready).对于vuejs.angularjs这些会在DOM ready完会才回去解析html view Template,所以对于Chrome这类快速的浏览器你会看见有闪烁的情况出现.而对于IE7,8这类解析稍慢的浏览器大部分情况下是不会

  • JS实现浏览器状态栏文字闪烁效果的方法

    本文实例讲述了JS实现浏览器状态栏文字闪烁效果的方法.分享给大家供大家参考,具体如下: 这里演示为你的IE浏览器状态栏增加文字闪烁效果,请看下面的状态栏中的文字一直不停的闪烁,火狐下可能效果不正常,本代码只针对IE浏览器. 运行效果截图如下: 在线演示地址如下: http://demo.jb51.net/js/2015/js-status-bar-txt-blink-codes/ 具体代码如下: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Tra

  • JS按钮闪烁功能的实现代码

    html <body onload="blinklink()" onunload="stoptimer()"> <a href="javascript:;" rel="external nofollow" class="iforeginbtn" id="flashit">马上注册领取</a> </div> js var flashit=do

  • js实现ArrayList功能附实例代码

    1.ArrayList方法摘要 构造方法摘要 ArrayList() 构造一个初始容量为 10 的空列表. ArrayList(Collection<? extends E> c) 构造一个包含指定 collection 的元素的列表,这些元素是按照该 collection 的迭代器返回它们的顺序排列的. ArrayList(int initialCapacity) 构造一个具有指定初始容量的空列表. 方法摘要 boolean add(E e) 将指定的元素添加到此列表的尾部. void ad

  • pageGroup.js实现分页功能

    本文实例为大家分享了pageGroup.js实现分页功能的具体代码,供大家参考,具体内容如下 1.html页面 引入 <link rel="stylesheet" type="text/css" href="/stylesheets/pageGroup.css" rel="external nofollow" > <script src="/javascripts/web/pageGroup.js&

  • 原生js实现购物车功能

    本文实例为大家分享了js实现购物车功能的具体代码,供大家参考,具体内容如下 使用html配合原生js实现购物车功能 * 实现购物车商品数量的加减,注意数量最少为1,数量输入仅能为数字 * 实现购物车商品的移除 * 可以在同一页面再设计几个商品信息,每个商品有价格,图片,名称,以及添加至购物车按钮,点击按钮后添加至购物车 * 实现购物车商品的总价计算 <!doctype html> <html lang="en"> <head> <meta ch

  • js实现验证码功能

    本文实例为大家分享了js实现验证码功能的具体代码,供大家参考,具体内容如下 #前面是拆解着讲的,不想看可以直接跳过,带注释的完整版代码和效果在后面 首先在页面中准备一个输入框,一个显示验证码的盒子和一个提交按钮 <body> <input type="text"> <div></div> <button>提交</button> </body> 然后加一些样式 input { width: 150px;

  • 用js实现用户注册功能

    本文实例为大家分享了js实现用户注册功能的具体代码,供大家参考,具体内容如下 1.HTML代码结构 <BODY> <FORM action="success.html" method="post" name="myform" onSubmit="return checkForm()"> <TABLE border="0" cellpadding="0" ce

  • js实现购物车功能

    本文实例为大家分享了js实现购物车功能的具体代码,供大家参考,具体内容如下 购物车实现3种方式 1.利用cookie 优点:不占用服务器资源,可以永远保存,不用考虑失效的问题 缺点: 对购买商品的数量是有限制的,存放数据的大小 不可以超过2k,用户如果禁用cookie那么就木有办法购买商品,卓越网实现了用户当用户禁用cookie,也可以购买. 2.利用 session 优点:用户禁用cookie,也可以购物 缺点:占用服务器资源,要考虑session失效的问题 3.利用数据库 优点:可以记录用户

  • js实现计算器功能

    本文实例为大家分享了js实现计算器功能的具体代码,供大家参考,具体内容如下 知识点 eval() 函数可计算某个字符串,并执行其中的的 JavaScript 代码. 代码如下 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>js计算器</title> <link href="../css/

  • js实现筛选功能

    本文实例为大家分享了js实现筛选功能的具体代码,供大家参考,具体内容如下 功能 通过复选框对显示内容进行筛选,如,勾选后仅显示在线用户. 代码 js ※需 jQuery. function filter() { var check =document.getElementById('checkbox'); var members = $('.member'); var status = $('.memberStatus'); if (check.checked) { members.each(f

  • js实现抽奖功能

    本文实例为大家分享了js实现抽奖功能的具体代码,供大家参考,具体内容如下 html部分: <div id="title" class="title">开始抽奖啦</div> <div class="btns"> <span id="play">开始</span> <span id="stop">结束</span> </

随机推荐