zoukankan      html  css  js  c++  java
  • 定时器

    开启定时器:单位是1000毫秒  1000毫秒=1秒  每隔一秒弹出窗口 无限执行

    setInterval() 间隔型

    function show(){

    alert('1');

    }

    setInterval(show,1000);

    ---------------------------------------

    setTimeout  延时型:只执行一次

    function show(){

    alert('1');

    }

    setTimeout(show,1000);

    --------------------------------------

     关闭定时器:

    clearInterval 关闭间隔型定时器

    clearTimeout 关闭延时型定时器

    window.onload=function(){

    var aBtn=document.getElementById('btn1');

    var bBtn=document.getElementById('btn2');

    var timer=null;

    aBtn.onclick=function(){

    timer=setInterval(function(){alert('a')},1000);

    };

    bBtn.onclick=function(){

    clearInterval(timer); 

    };

    };

    --------------------------------------------------------------------------

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>QQ头像鼠标放置效果</title>
    <style>
    div{float:left;margin:10px;}
    #div1{
    50px;
    height:50px;
    background:#F00;
    }
    #div2{250px;
    height:280px;
    background:#666;
    }

    </style>
    <script>
    window.onload=function(){
    var a=document.getElementById('div1');
    var b=document.getElementById('div2');
    var timer=null;
    a.onmouseover=function(){
    clearTimeout(timer);
    b.style.display='block';
    };
    a.onmouseout=function(){
    timer=setTimeout(function(){
    b.style.display='none';
    },500);
    };
    b.onmouseover=function(){
    clearTimeout(timer);
    };
    /
    b.onmouseout=function(){
    setTimeout(function(){
    b.style.display='none';
    };
    },500;
    };
    </script>
    <body>
    <div id="div1"></div>
    <div id="div2"></div>
    </body>
    </html>

    -----------------------------------------------------------------------------------------------------------

  • 相关阅读:
    C语言|博客作业08
    C语言|博客作业04
    C语言|博客作业02
    C语言|博客作业06
    C语言|博客作业03
    第一周作业
    C语言|博客作业05
    C语言|博客作业07
    C语言|博客作业09
    为什么get比post更快
  • 原文地址:https://www.cnblogs.com/hello-web/p/6835409.html
Copyright © 2011-2022 走看看