Как определить размер окна, а затем сделать что-то с помощью оператора jquery switch - PullRequest
Новая
       11

Как определить размер окна, а затем сделать что-то с помощью оператора jquery switch

16 голосов
/ 05 сентября 2011

Я хотел бы проверить размер окна с помощью jquery и исходя из разных разрешений, я хотел бы изменить фоновое изображение. Так что я думал как-то использовать оператор «switch» для большего количества случаев, но я просто не знаю, как это будет выглядеть. Это базовая структура, которую я хочу, но с большим количеством опций: 

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

Спасибо за вашу помощь.

Ответы [ 2 ]

45 голосов
/ 05 сентября 2011

Вы должны использовать: 

$(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
}
1 голос
/ 05 сентября 2011

Оператор switch не позволяет выполнять такие вещи, как проверка чисел между определенными значениями, и не позволяет проверять несколько переменных, либо ...

Так что для этого конкретного сценарияЯ думаю, что лучше всего подходит просто список 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;
    ...
    ...
}
...