phpcms 漂浮广告

<?php
// 在模板文件中添加以下代码
?>
<script type="text/javascript">
function floatAd() {
    var ad = document.getElementById('float-ad');
    var x = window.innerWidth - ad.offsetWidth;
    var y = window.innerHeight - ad.offsetHeight;
    var xy = { 'top': y, 'left': x };
    var speed = 0.05;
    var dirX = 1;
    var dirY = 1;

    function moveAd() {
        xy['top'] += ad.offsetHeight * speed * dirY;
        xy['left'] += ad.offsetWidth * speed * dirX;
        if (xy['top'] <= 0 || xy['top'] >= window.innerHeight - ad.offsetHeight) dirY = -dirY;
        if (xy['left'] <= 0 || xy['left'] >= x) dirX = -dirX;
        ad.style.top = xy['top'] + 'px';
        ad.style.left = xy['left'] + 'px';
        requestAnimationFrame(moveAd);
    }

    moveAd();
}
window.onload = floatAd;
</script>
<div id="float-ad" style="position: absolute; width: 200px; height: 100px; background-color: #f0f0f0;">
    <a href="https://example.com">广告内容</a>
</div>