如何检测窗口大小，然后使用 jquery switch 语句执行某些操作

发布于 2024-12-03 00:19:38 字数 259 浏览 4 评论 0原文

我想用 jquery 检查窗口大小，并根据不同的分辨率我想更改背景图像。所以我想以某种方式在更多情况下使用“switch”语句，但我只是不知道这会是什么样子。这是我想要的基本结构，但有更多选项：

if ((screen.width>=1024) && (screen.height>=768)) {
 //do something
}
else {
//do something else
}

感谢您的帮助。

原文

i would like to check for the window size with jquery and based on the different resolutions i would like to change the background image. So i was thinking to somehow use the "switch" statement for more cases, but i just don't know how this would look like. This is the basic structure i want but with more options:

if ((screen.width>=1024) && (screen.height>=768)) {
 //do something
}
else {
//do something else
}

Thanks for your help.

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

ま昔日黯然 2024-12-10 00:19:38

您应该使用：

$(window).width();   // returns width of browser viewport
$(document).width(); // returns width of HTML document

$(window).height();   // returns heightof browser viewport
$(document).height(); // returns height of HTML document

然后您可以执行以下操作：

var width = $(window).width(); 
var height = $(window).height(); 

if ((width >= 1024  ) && (height>=768)) {
 //do something
}
else {
//do something else
}

编辑 - 我认为在这种情况下使用 switch 语句没有用。 switch 语句只是 if...else 表示法的另一种方式，在这种情况下我发现更有用，因为您需要进行多次比较：

if ((width >= 1280) && (height>=1024)) {
 //do something
}
else if ((width >= 1024  ) && (height>=768)){
//do something else
} else if ((width >= 800) && (height>=600)){
//do something else
}else{
//do something else
}

You should use:

$(window).width();   // returns width of browser viewport
$(document).width(); // returns width of HTML document

$(window).height();   // returns heightof browser viewport
$(document).height(); // returns height of HTML document

and then you could do:

var width = $(window).width(); 
var height = $(window).height(); 

if ((width >= 1024  ) && (height>=768)) {
 //do something
}
else {
//do something else
}

EDIT - i don't think that using a switch statement is useful in this case. The switch statement is just an alternate way for the if...else notation that in this case i find more useful because you have multiple comparison to do:

if ((width >= 1280) && (height>=1024)) {
 //do something
}
else if ((width >= 1024  ) && (height>=768)){
//do something else
} else if ((width >= 800) && (height>=600)){
//do something else
}else{
//do something else
}

回复收藏 0 原文

狠疯拽 2024-12-10 00:19:38

switch 语句不会让你做一些事情，比如检查某些值之间的数字，它也不会让你检查多个变量......

所以对于这个特定的场景，我认为best fit 实际上只是一个 if-elseif 语句列表，就像您已经在做的事情一样。

在 switch 中进行“范围检查”确实很冗长：

switch(windowWidth) {
    case 1:
    case 2:
    case 3:
    case 4:
    case 5:
        //Do something if value is less than or equal to 5
        break;
    case 6:
    case 7:
    case 8:
    case 9:
    case 10:
        //Do something if value is higher than 5 AND less than or equal to 10
        break;
    ...
    ...
}

The switch statement won't let you do stuff like checking for numbers between certain values, and it won't let you check on multiple variables, either...

So for this particular scenario, I think the best fit is actually just a list of if-elseif statements, like you're already on your way to do.

To do "range checks" in switch is really verbose:

switch(windowWidth) {
    case 1:
    case 2:
    case 3:
    case 4:
    case 5:
        //Do something if value is less than or equal to 5
        break;
    case 6:
    case 7:
    case 8:
    case 9:
    case 10:
        //Do something if value is higher than 5 AND less than or equal to 10
        break;
    ...
    ...
}

回复收藏 0 原文

~没有更多了~