2011-09-05 12 views
15

Vorrei verificare la dimensione della finestra con jquery e in base alle diverse risoluzioni che vorrei cambiare l'immagine di sfondo. Quindi stavo pensando di usare in qualche modo l'istruzione "switch" per più casi, ma semplicemente non so come sarebbe. Questa è la struttura di base che voglio ma con più opzioni:Come rilevare la dimensione della finestra e quindi fare qualcosa con l'istruzione switch jquery

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

Grazie per il vostro aiuto.

risposta

1

La dichiarazione switch non ti consente di fare cose del genere verificare i numeri tra alcuni valori, e non ti permetterà di controllare più variabili, o ...

Quindi, per questo particolare scenario, penso che la soluzione migliore sia in realtà solo un elenco di dichiarazioni if-elseif, come te ' stai già andando.

da fare "test di ricezione" in switch è davvero 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

Yeh, penso che sia giusto @peirix, voglio dire che sono sicuro del tuo diritto sull'istruzione switch, ma speravo di implementarlo in qualche modo, come ad esempio controllare solo la larghezza dello schermo e se corrisponde al caso quindi fare qualcosa ... ma penso che rimarrò if-elseif –

+0

È possibile attivare intervalli se si fa qualcosa di simile: switch (true) {case windowWidth> = 1 && windowWidth <= 5: break; case windowWidth> = 6 && windowWidth <= 10: break; } – hdctambien

38

Si dovrebbe usare:

$(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 

e poi si potrebbe fare:

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

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

EDIT - non credo che l'utilizzo di un'istruzione switch è utile in questo caso. L'istruzione switch è solo un modo alternativo per la se ... notazione altro che in questo caso ho trovato più utile, perché si dispone di più rispetto a che fare:

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

Grazie @Nicola Peluchetti ma vorrei più casi, come con l'istruzione switch. –

+0

ho aggiornato la mia risposta –

Problemi correlati