Domanda Come ridimensionare l'altezza massima di un div al ridimensionamento della finestra?


Ho cercato in alto e in basso per una risposta. Ho letto alcune cose qui e nessuno sembra avere una soluzione a quello che voglio fare. Sto cercando di ridimensionare l'altezza massima di un div quando la dimensione della finestra raggiunge un certo punto. Il menu principale si trova nella parte inferiore della pagina e il contenuto esce dal menu che scorre verso l'alto.

Esempio di ciò che ho:

<div class="content">
    //some content pics/text etc.
</div>

css:

.content { width: 550px; overflow: auto; }`

Ora ovviamente posso impostare l'altezza massima nel css al momento, ma non ne ho bisogno fino a quando la dimensione dello schermo raggiunge 800px in altezza. Fammi sapere se mi manca qualcosa di semplice qui.

Sono aperto all'utilizzo delle regole jQuery o css.


12
2017-08-16 05:28


origine


risposte:


$(window).on('resize', function(){
    if($(this).height() <= 800){
        $('.content').css('max-height', '800px'); //set max height
    }else{
        $('.content').css('max-height', ''); //delete attribute
    }
});

26
2017-08-16 05:39



Ho un esempio: http://jsfiddle.net/sechou/WwpuJ/

$(window).resize(function () { 
   if($(window).height() <= 800){
       $('div.content').css('max-height', 800);
   }else{
       $('div.content').css('max-height', ''); 
   }  
});

4
2017-08-16 05:37