【JavaScript】定时展开与定时收起

点击按钮显示或隐藏.png
    body{
        margin: 0 auto;
        padding: 0;
    }
    #show{
        background-color: #e8e8e8;
        width: 700px;
        display: block;
        margin: 0 auto;
        /*网页中内容居中显示*/
        padding: 5px;
        font-size: 9pt;
        /* 9pt的字体是没有锯齿的  */
        height: auto;
        /*因整个div部分,会有一部分动态显示或者隐藏,所以将高度设为auto*/
    }
    #hidden{
        display: none;
    }
    .slide{
        margin: 0 auto;
        padding: 0px;
        width: 700px;
        border-top: solid 4px gray;
    }
    .hiddenBtn{
        background-color: grey;
        width: 120px;
        height: 30px;
        text-align: center;
        margin: 0 auto;
        display: block;
        color: #fff;
        text-decoration: none;
        padding-top: 10px;
    }

【JavaScript】定时展开与定时收起_第1张图片
广告的显示与隐藏-结构.png

增加函数addH和减少subH,判断高度再增加或减少高度,并使用setTimeout对时间进行约束,定义窗口显示或隐藏。

setTimeout(code,millisec)方法用于在指定的毫秒数后调用函数或计算表达式。code 要用括号括起呢。而是里面是函数调用。
onload()事件,在window.onload是页面加载完成后立即发送;图像加载完成后立即发生是 图片的 onload 事件。
return是退出函数。

    #pn{
        display: block;
        height: auto;//pn为广告的容器,因高度在变化,一定为auto。
        background-color: #e8e8e8;
        width: 700px;
        margin: 0 auto;
        padding: 5px;
        text-align: center;
    }
    .content{
        margin: 0 auto;
        padding: 10px;
        background-color: gray;
        width: 700px;
        text-align: center;
    }
     body{
        margin: 0 auto;
        padding: 0;
    }

你可能感兴趣的:(【JavaScript】定时展开与定时收起)