当用户单击最大化按钮时，JavaScript窗口调整大小事件无法正常工作
当我单击浏览器窗口的“最大化”按钮时，我编写的一个函数将在调整窗口大小时执行，但无法正常工作。当我使用鼠标调整窗口大小时，它工作。
<div class="div1">
<div class="div2"></div>
</div>
.div1 { position: relative; }
.div2 { position: absolute; width: 300px; top: 0; transition: all 0.5s ease; }
@media only screen and (max-width: 1024px) { .div2 { width: 200px; } }
function aFuntion() {
let div1 = document.querySelector('.div1');
let div2 = document.querySelector('.div2');
let diff = div1.clientHeight - div2.clientHeight;
div1.style.top = -diff + 10 + 'px';
};
// Call the function.
// This worked!
aFuntion();
// Call the function when users resize the window.
// This worked!
window.addEventListener('resize', aFuntion);
// Users click on the Maximize button of the window.
// The function does not work!
BIG阳3回答
-
森栏
我已经在Firefox，Chrome和Internet Explorer中测试了下面的代码，它正在按预期工作。我知道这是一种解决方法，因为事件是从body标签触发的，但也许它会对你有所帮助。<html><head><script>function resizeFunction() { console.log("working");}</script></head><body onresize="resizeFunction()">content</body></html> -
慕婉清6462132
好的。我解决了自己的问题。以某种方式过渡：全部0.5秒轻松; 调整大小不起作用。我删除了转换：所有0.5秒轻松; 它起作用了。 -
FFIVE
尝试 document.addEventListener('resize', aFuntion);
随时随地看视频慕课网APP
相关分类
JavaScript