window

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title>window</title>
        <style type="text/css">
            body{
                height: 3000px;
            }
            .toTop{
                width: 50px;
                height: 50px;
                background-color: gray;
                color: white;
                line-height: 50px;
                text-align: center;
                transform: rotate(-90deg);
                position: fixed;
                right: 100px;
                bottom: 100px;
                display: none;
            }
            .textDiv{
                width: 100px;
                font-size: 40px;
            }
        </style>
    </head>
    <body>
        <div class="toTop">-></div>
        <div class="textDiv">大肯德基奧數(shù)傀儡的航空路撒就打開了撒嬌看來大家撒看來大家撒開了大家快來撒大家快來撒打卡上</div>
    </body>
    <script type="text/javascript">
        var toTop=document.querySelector(".toTop");
        window.onload = function () {
            console.log("頁面加載完畢");
//          document.write("123");
        }
        
        //頁面滑動的時候執(zhí)行
        window.onscroll = function () {
            console.log("頁面滑動了"+document.body.scrollTop);
            if(document.body.scrollTop>=600){
                toTop.style.display="block";
            }else{
                toTop.style.display="none";
            }
        }
        toTop.onclick=function  () {
            document.body.scrollTop=0;
        }
        //窗口大小發(fā)生變化的時候執(zhí)行的方法
        window.onresize=function () {
            console.log(document.body.clientWidth);
        }
    </script>
</html>
最后編輯于 ：
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
平臺聲明：文章內(nèi)容（如有圖片或視頻亦包括在內(nèi)）由作者上傳并發(fā)布，文章內(nèi)容僅代表作者本人觀點，簡書系信息發(fā)布平臺，僅提供信息存儲服務。

推薦閱讀更多精彩內(nèi)容