运行屏幕有一定宽度时的代码

Question

我只是想在 window 的大小小于 700 像素时在控制台中写一条消息。

我试过的是：

if(window.innerWidth < 700){
console.log("hello");
}

和

if(screen.width < 700){
console.log("hello");
}

我没有收到任何错误消息，但代码没有运行。如果我在 700 之后投放 "px"，我会收到错误消息 "Uncaught SyntaxError: Unexpected identifier"。

Answer 1

您需要将其放入 window 的 resize 事件侦听器中。而且你还需要使用 window.innerWidth 并且它总是 returns 一个整数值。

if (window.attachEvent) {
  window.attachEvent('onresize', function() {
    if (window.innerWidth < 760)
      console.log("Less than 760");
    else
      console.log("More than 760");
  });
} else if (window.addEventListener) {
  window.addEventListener('resize', function() {
    if (window.innerWidth < 760)
      console.log("Less than 760");
    else
      console.log("More than 760");
  }, true);
} else {
  //The browser does not support Javascript event binding
}

Answer 2

onResize();
window.addEventListener('resize', onResize);

function onResize(){
    var width = document.documentElement.clientWidth;
}

Answer 3

您需要在 'window' 上监听 'resize' 事件：

window.addEventListener('resize', resize);

function resize() {

    if (window.innerWidth < 700) {

        console.log('window.innerWidth < 700');
        // window.removeEventListener('resize', resize); // once
    }
}

关于 .addEventListener 的更多信息：https://developer.mozilla.org/en-US/docs/Web/API/EventTarget/addEventListener

运行屏幕有一定宽度时的代码

Run code if screen has certain width

javascript

if-statement

width

screen

运行 屏幕有一定宽度时的代码

Run code if screen has certain width

javascript

if-statement

width

screen

运行屏幕有一定宽度时的代码