用JS在页面中实现随机漂浮的小广告

可以使用CSS和JavaScript来实现随机漂浮的小广告。

首先，在HTML中添加一个div元素，并且设置其样式为绝对定位，以便于在页面中随意移动。

<div id="ad" style="position: absolute;"></div>

接下来，在JavaScript中添加以下代码来实现广告的随机漂浮：

// 获取广告元素
var ad = document.getElementById("ad");

// 设置广告的初始位置
ad.style.left = Math.random() * window.innerWidth + "px";
ad.style.top = Math.random() * window.innerHeight + "px";

// 定义广告的漂浮动画
function animateAd() {
  // 计算广告的新位置
  var newLeft = parseFloat(ad.style.left) + (Math.random() - 0.5) * 20;
  var newTop = parseFloat(ad.style.top) + (Math.random() - 0.5) * 20;

  // 确保广告不会超出页面边界
  if (newLeft < 0) newLeft = 0;
  if (newTop < 0) newTop = 0;
  if (newLeft > window.innerWidth - ad.offsetWidth) newLeft = window.innerWidth - ad.offsetWidth;
  if (newTop > window.innerHeight - ad.offsetHeight) newTop = window.innerHeight - ad.offsetHeight;

  // 更新广告的位置
  ad.style.left = newLeft + "px";
  ad.style.top = newTop + "px";

  // 等待一段时间后再次执行动画
  setTimeout(animateAd, 1000 / 30);
}

// 开始执行动画
animateAd();

这段代码会在页面加载完成后开始执行，每隔1/30秒更新一次广告的位置，从而实现随机漂浮的效果。你也可以根据自己的需要调整漂浮的速度和范围。