max-height

Par thierrysudfr, il y a 15 ans

Javascript

Bonsoir,

je souhaite que le max-height (css) de ma div class="affichage" s'adapte à la hauteur de la fenêtre du navigateur.
Il suffit de rajouter ceci à la fin de la page (et un overflow dans le css) :

<script>
        jQuery().ready(function() {
        var hauteur=$(window).height();
        $('div.affichage').css('max-height',hauteur-120);
</script>

Mais comment faire pour éviter de répéter ce script à chaque page du site ?
Je précise que mon site tourne entièrement en ajax, et que ma div affichage est donc chargée par ajax à chaque nouvelle page (ou rafraîchissement).
Existe-t-il une fonction du type "live" qui accepterait le type load en argument, pour surveiller le chargement de ma div class="affichage" ?

Je ne suis pas sur d'avoir été très clair, mais merci d'avance de vos lumières.

Thierry

3 réponses

Grafikart, il y a 15 ans

Je ne crois pas qu'il y ai de live sur autre chose que click and co... Pour ce que tu cherche à faire je ne vois pas d'autre solution que déclencher ta fonction après chaque load de contenu... chiant mais efficace.

Sinon tu te crée une fonction perso genre "loadWithResize" :D

thierrysudfr, il y a 15 ans

Bonjour,
En effet, live ne fonctionne qu'avec click and co. Concernant le resize, mon petit script est déclenché à chaque $(window).resize, et fonctionne très bien. Mon souci demeure juste au chargement de la div.
Tiens, en te répondant, il me vient une idée... il suffirait de rajouter mon script à la suite de ma requête ajax, juste après le $('div.affichage).show()...
Je vais tester, (enfin ce soir, là je suis au bureau, pas d'outil de développement ici, lol), et je reviens valider ou non cette réponse.

Merci pour ton intervention.

thierrysudfr, il y a 15 ans

Ben oui, c'était pas plus compliqué que ça, lol... Parfois, il suffit d'en parler pour que la réponse arrive d'elle même, lol.

Ceci dit, si quelqu'un sait comment on peut saisir l’évènement load dans une page rafraichie en ajax, ça peut servir ! je ne valide pas ma réponse au cas un quelqu'un aurait la réponse.

Voici le code fonctionnel :

function linksubmit(page,div,parametres){
    if (div==''){
        div=onglet
    }
    $.ajax({
        url: page,
        type: 'POST',
        data: parametres,
        cache:false,
        success:function(html){
            afficher(div,html);
        },
        error:function(XMLHttpRequest,textStatus, errorThrown){
            afficher(div,'Une erreur s\'est produite au chargement de cette page ; Merci de nous signaler cette erreur en cliquant ici.');
        }
    });
}
function afficher(divaffiche,data){
    var largeurAffichage=$('#contenuPage').width()-245;
    var hauteur=$(window).height();
    $(divaffiche).fadeOut(0,function(){
            $(divaffiche).empty();
            $(divaffiche).append(data);
            $(divaffiche).fadeIn('fast');

            $('div.affichage').css('width',largeurAffichage);
            $('div.affichage').css('max-height',hauteur-120);
    });
}