zoukankan      html  css  js  c++  java
  • 卷帘效果

    <head>
    <title>卷帘效果</title>
    </head>
    <body>
    <input id="shen" type="button" value="展开">
    <input id="shou" type="button" value="收起">
    <div id="wind" style="background-color:#bbbbbb;200px;height:1px;">
    </div>
    <script type="text/javascript">
    //控制展开的旗标
    var shenflag=true;
    var shouflag = false;
    function shen(){
    if(shenflag){
    shouflag=false;
    var tm;
    var windHeight=document.getElementById("wind").style.height;
    if(parseInt(windHeight.substring(0,windHeight.indexOf("px")))<100){
    document.getElementById("wind").style.height=
    parseInt(windHeight.substring(0,windHeight.indexOf("px")))+2+"px";
    tm = setTimeout("shen()",50);
    }else{
    clearTimeout(tm);
    shouflag = true;
    }
    }
    }
    function shou(){
    if(shouflag){
    shenflag=false;
    var tm;
    var windHeight=document.getElementById("wind").style.height;
    if(parseInt(windHeight.substring(0,windHeight.indexOf("px")))>3){
    document.getElementById("wind").style.height=
    parseInt(windHeight.substring(0,windHeight.indexOf("px")))-2+"px";
    tm = setTimeout("shou()",50);
    }else{
    clearTimeout(tm);
    shouflag = true;
    }

    }
    }
    document.getElementById("shen").onclick=shen;
    document.getElementById("shou").onclick=shou;
    </script>
    </body>

  • 相关阅读:
    JavaScript 数组去重
    Javascript数组 reduce() 方法
    Vue事件总线(EventBus)
    前端多媒体-音频
    前端多媒体-视频
    VUE3.0 总结
    el-select地区区号选择
    vue中点击获取相应元素
    Markdown 语法
    Codeforces Round #295 (Div. 2) B. Two Buttons 520B
  • 原文地址:https://www.cnblogs.com/my-king/p/4633617.html
Copyright © 2011-2022 走看看