Permet de forcer un élément à avoir une hauteur de 80% :
function checkSize() { // Adaptation de la hauteur de l'iframe de PDF viewer jQuery('iframe.pdfjs-viewer').height( jQuery(window).height()*0.8+"px" ); } // Quand on change la taille de la fenêtre il faut réinitialiser menuPosition jQuery(window).resize(function(e) { checkSize(); }); // On vérifie une première fois au lancement checkSize();
Pour vérifier quelle largeur va faire une image si on met sa hauteur à 90% du viewport :
function change_size_seul() { if( jQuery(window).width() < 350 ) { if( jQuery('.colonneB-image').first().children().first().attr('width') / jQuery('.colonneB-image').first().children().first().attr('height') * jQuery(window).height() * 0.9 > jQuery(window).width() ) { // Si on redimentionne la hauteur de l'image à 90% de la hauteur du viewport elle va dépasser en largeur, donc on reste adapté en largeur jQuery('.colonneB-image').first().children().first().css('width', '100%').css('height', 'auto'); } else { // Ça ne va pas dépasser, on peut se mettre à 90% de la hauteur jQuery('.colonneB-image').first().children().first().css('width', 'auto').height( jQuery(window).height()*0.9 ); } } else { jQuery('.colonneB-image').first().children().first().css('width', '100%').css('height', 'auto');// Réinitialise la taille de l'image en cas de retour en 2 colonnes } jQuery('#colonneB').height( jQuery('.colonneB-image').first().height()+20 );// Une fois la taille de l'image modifiée on peut adapater la taille de #colonneB } jQuery(window).resize(function(e) { change_size_seul(); });
La formule est : (largeur image / hauteur image) x hauteur viewport * 0,9