Question

我需要你，因为我需要检测div是否正在调整大小，我只是使用JQuery和window.resize找到了一些解决方案。

问题是我不想使用任何库，窗口没有调整大小。 div正在调整大小，因为弹出一个菜单。我可以通过菜单上的调度事件来做到这一点，但我希望我的小部件能够自行运行。

感谢您的解决方案。

我希望在不使用菜单上的事件（黄色div）的情况下获得红色矩形的onresize。类似的东西：

child.addEventListener('resize', function(){ /* do something */ }, false);

Answer 1

<div>元素不属于此类事件。但是，您可以使用区间函数来查看其状态style.width和style.height。如果发生变化则会触发回调。

Answer 2

您可以根据屏幕尺寸更改文本或内容，属性或样式表： HTML：您可以遵循： https://developer.mozilla.org/en-US/docs/Web/API/GlobalEventHandlers/onresize

<p class="change">Frequently Asked Questions (FAQ)</p>
<p class="change">Frequently Asked Questions </p>

Javascript：

<script>
const changeText = document.querySelector('.change');
function resize() {
  if((window.innerWidth<500)&&(changeText.textContent="Frequently Asked Questions (FAQ)")){
    changeText.textContent="FAQ";
  } else {
    changeText.textContent="Frequently Asked Questions (FAQ)";
  }
}
window.onresize = resize;
</script>

纯javascript div resize事件

2 个答案: