时间戳

首页 > 解决方案 > javascript Window.onscroll 垂直移动 div

javascript - javascript Window.onscroll 垂直移动 div

问题描述

我有一个简单的脚本：我想在页面滚动时垂直移动我的 div，但是虽然触发了事件，但 div 仍然保持在相同的位置 

<script type="text/javascript">
    window.onscroll = DoScroll;
    function DoScroll() {
        var mydiv = document.getElementById("myFloatingDiv");
        mydiv.top = mydiv.top + 230;             
    }
</script>  

<style>
    body {
        background-color: linen;
        margin-left: 50px;
        margin-right:60px;
        margin-top:15px;
    }

    .myFloatingDivCSS{
        position:absolute;
        left:50px;
        top:100px;
        width:20%;
        height:300px;
        background:blue;
    }
</style> 

<body>
    <div class="myFloatingDivCSS" id="myFloatingDiv" ">
        <ul>
            <li></li>
            <li></li>
        </ul>
    </div>

但我没有看到 div 移动......为什么会这样？

标签： javascriptonscroll

解决方案

我找到了我想要的答案，感谢这里写的所有内容：

window.onscroll = DoScroll;


function DoScroll() {
    var mydiv = document.getElementById("myFloatingDiv");
    mydiv.style.top = Math.max(100, window.pageYOffset) + 'px';
  }

推荐阅读