html飘

<div id="floatnotic"
    style="color :red ;font-size :larger; width :200px;  background-color :#ffd800; position:absolute; z-index:99999;display:block;">
    这里是内容,这里是内容,这里是内容
</div>
<script type="text/javascript">

    window.onload = function () {

        var floatnotic = document.getElementById('floatnotic');
        var sx = sy = 10;
        var x = y = 0;

        function move() {
            if (document.documentElement.clientWidth - floatnotic.offsetWidth - 10 < x || x < 0) {
                sx = -sx;
            }

            if (document.documentElement.clientHeight - floatnotic.offsetHeight - 10 < y || y < 0) {
                sy = -sy;
            }

            x = floatnotic.offsetLeft + sx;
            y = floatnotic.offsetTop + sy;

            floatnotic.style.left = x + 'px';
            floatnotic.style.top = y + 'px';
        }
        var timer = setInterval(move, 100);
        floatnotic.onmouseover = function () {
            clearInterval(timer);
        }

        floatnotic.onmouseout = function () {
            timer = setInterval(move, 1000);
        }
    }
</script>

  

posted @ 2022-12-01 16:01  gzhq  阅读(17)  评论(0编辑  收藏  举报