天天看點

使用jQuery生成div元素閃爍效果

HTML代碼:

<div >
	
</div>
           

CSS代碼:

body{
	background:#CFCFCF;
}
div{
    width:100px;
    height:100px;
    background-color:orange;
  }
           

jQuery代碼:

/*
  1.先定義一個count,用來計數,
  2.擷取目前body和div的背景色存儲
  3.閃爍效果思路:
    通過計數count來确定目前div所擁有的背景色
    用setTimeout()來控制閃爍的時間
  4.函數寫好後,要先執行以下函數,之後才能夠循環執行。
*/
var count = 0;
var oldcol = $('body').css('background');
var divcol = $('div').css('background');
var sansuo = function(){
  count++;
  
  if(count%2==0){
    $('div').css('background',divcol);
  }else{
    $('div').css('background',oldcol);
  }
  setTimeout(sansuo, 500);
}; 

sansuo();