放大镜练习

function $(str) {
return document.querySelector(str)
}
window.onload = function () {
let l = $(’#left’).offsetLeft + $(’#left’).offsetWidth
let t = $(’#left’).offsetTop

$(’#right’).style.left = l +‘px’
$(’#right’).style.top = t +‘px’

$(’#left’).onmouseenter = ()=>{
$(‘#right’).style.display = ‘block’

$(’#left’).onmouseleave = ()=>{
$(’#right’).style.display = ‘none’
}

$(’#left’).onmousemove = (e) => {
let x = e.pageX - $(’#left’).offsetLeft
let y = e.pageY - $(’#lleft’).offsetTop

x = x / $(’#left’).offsetWidth
y = y / $(’#left’).offsetHeight

x = (x * 100).toFixed(4) + ‘%’
y = (y * 100).toFixed(4) + ‘%’

$(’#right’).style[‘background-position-x’] = x
$(’#right’).style[‘background-position-y’] = y
}
}
}