Comment bloquer en format portait une page HTML5 ? Seulement en CSS je ne pense pas que cela soit possible ? En JS : possible mais je ne vois pas comment mis à part faire une rotation du contenu en même temps ? D'autre solution ? Dans une APP oui on peut bloquer l'orientation, sur le device directement aussi mais dans une page toute simple en HTML5 ? (C'est une régie pub qui le met dans ces specs)
Comment faire ?

html5 mobile pub mobile
2
1

4 réponses

il y a 4 ans par Gerald
Pour avoir bidouillé un peu de CSS récemment, il me semble avoir vu passer un truc comme ça dans un tuto sur les transformations CSS. L'idée : forcer une rotation à 90% quand on est en paysage, ou en portrait (du coup ça n'y passe jamais et ça ressemblait à (je n'ai pas essayé et je vais essayer de retrouver l'origine) :
.paysage{-webkit-transform:rotate(90deg);}
.portrait{//ton code pour le mode portrait}
Les codeurs sur Skiller ? pour confirmer / infirmer ?
4
il y a 4 ans par RomainPrevot
Merci Gérald pour cette réponse, je connaissais aussi l'astuce, mais je ne trouve pas ça super clean, surtout que de temps en temps, les CSS transform sont capricieuses, notamment des problèmes de flou sur des "scale" avec certains nav, ect ... J'aurais voulu une solution moins aléatoire :)
1
il y a 4 ans par Gerald
Ah ces régies pubs ! Pour le coup, c'est à eux de fournir l'info...
2
il y a 4 ans par RomainPrevot
tout à fait d'accord ! :D
1
il y a 3 ans par Julien_
Je reformule : tu veux bloquer Safari Mobile en mode portrait ?
-> Impossible :)

Une petite solution en JavaScript :

$(document).ready(function () {
function reorient(e) {
var portrait = (window.orientation % 180 == 0);
$("body > div").css("-webkit-transform", !portrait ? "rotate(-90deg)" : "");
}
window.onorientationchange = reorient;
window.setTimeout(reorient, 0);
});

(source : stackoverflow.com/questions/1207008/how-do-i-lo... )
2
il y a 3 ans par RomainPrevot
Merci =)
1
il y a 3 ans par oimoci
Alors, ça, c'est une réponse technique !
1
il y a 4 ans par PiemGChaps
Hello Romain,
A mon sens il faut que tu gères ça dans ta feuille de style CSS, passer chacun de tes éléments au crible pour les sizer comme il faut avec margin, padding and co afin que ton modèle en portrait ou en paysage soit au top...
1
il y a 4 ans par RomainPrevot
Merci PiemGChaps mais ça ne réponds pas à ma question :) sinon si j'opte pour ta solution je met un message en paysage grace aux media-query et puis c'est fini :) c'est d'ailleurs sûrement ce que je vais faire car les régies n'ont qu'a nous donner l'info !
1

Vous aimez Skiller?

Rejoignez la communauté.