如何添加放大镜到我的网站？

<div id="magnifier"></div>

#magnifier {
  width: 200px;
  height: 200px;
  border: 1px solid #ccc;
}

var magnifier = document.getElementById('magnifier');
var image = document.getElementById('image'); // 原始图像元素

magnifier.addEventListener('mousemove', function(event) {
  var mouseX = event.clientX - magnifier.offsetLeft;
  var mouseY = event.clientY - magnifier.offsetTop;
  
  var magnifierWidth = magnifier.offsetWidth;
  var magnifierHeight = magnifier.offsetHeight;
  
  var imageWidth = image.offsetWidth;
  var imageHeight = image.offsetHeight;
  
  var ratioX = imageWidth / magnifierWidth;
  var ratioY = imageHeight / magnifierHeight;
  
  var backgroundPositionX = -mouseX * ratioX;
  var backgroundPositionY = -mouseY * ratioY;
  
  magnifier.style.backgroundPosition = backgroundPositionX + 'px ' + backgroundPositionY + 'px';
});