La page Web est con?ue pour les téléphones mobiles avec écran horizontal. Si la page est affichée sur un écran vertical, la page sera gachée.
學(xué)習(xí)是最好的投資!
Peut juger puis inviter l'utilisateur à faire une rotation
if(window.orientation==90||window.orientation==-90){
alert("橫屏狀態(tài)!")
}
Ou écoutez les événements de rotation
window.onorientationchange = function(){
switch(window.orientation){
case -90:
case 90:
alert("橫屏:" + window.orientation);
case 0:
case 180:
alert("豎屏:" + window.orientation);
break;
}
}
La requête multimédia CSS peut également être jugée
@media (orientation: portrait) { } 橫屏 @media (orientation: landscape) { }豎屏
Mais il existe encore une solution?:
Lors de l'ouverture de la page, vous pouvez utiliser window.orientation pour déterminer si la page Web est horizontale ou verticale. Si elle est verticale, ajoutez des styles à la page entière
transform: rotate(90deg);
De cette fa?on, votre page affichera l'effet d'écran horizontal.
Le frontal ne peut pas contr?ler l'écran horizontal et vertical du téléphone mobile, mais il peut être jugé à l'aide des conditions CSS?:
Portrait?:
@media screen and (orientation:portrait){
#wrap{
display:none;
}
}
Paysage?:
@media screen and (orientation:landscape){
#wrap{
display:block;
}
}
Par exemple, lorsque l'écran est vertical, le texte d'invite s'affiche?: Veuillez naviguer horizontalement.
Utilisez l'opération CSS pour afficher et masquer après l'écran horizontal.