Per bilanciare meglio una pagina su cui sto lavorando vorrei trovare un modo per aumentare il margine superiore di un DIV in base alla risoluzione dello schermo. Qual è il modo migliore per impostare queste dimensioni con jQuery o Javascript?jQuery Risoluzione schermo Risoluzione altezza
30
A
risposta
71
Per ottenere la risoluzione dello schermo in JS utilizzare screen
oggetto
screen.height;
screen.width;
Sulla base di che valori è possibile calcolare il margine a tutto ciò che più vi si addice.
4
Scopri i jQuery dimensions plugin
22
Ecco un esempio su come centrare un oggetto in verticale con jQuery:
var div= $('#div_SomeDivYouWantToAdjust');
div.css("top", ($(window).height() - div.height())/2 + 'px');
ma si potrebbe facilmente cambiare che per qualunque i vostri bisogni sono.
5
Un altro esempio per div verticale e in orizzontale centrato o qualsiasi altro oggetto (s):
var obj = $("#divID");
var halfsc = $(window).height()/2;
var halfh = $(obj).height()/2;
var halfscrn = screen.width/2;
var halfobj =$(obj).width()/2;
var goRight = halfscrn - halfobj ;
var goBottom = halfsc - halfh;
$(obj).css({marginLeft: goRight }).css({marginTop: goBottom });
2
var space = $(window).height();
var diff = space - HEIGHT;
var margin = (diff > 0) ? (space - HEIGHT)/2 : 0;
$('#container').css({'margin-top': margin});
sto solo imparando Javascript; Qualche possibilità che tu mi mostri l'approccio che avresti impiegato per calcolare l'altezza e aggiungere un certo margine superiore a questo? L'ID del div che sto regolando è "port-cont". –
Benché si disponga di un'altezza dello schermo, è necessario sottrarre qualcosa per il menu del browser, la barra di stato, ecc. È difficile dire quanto sarebbe perché dipende dal browser. Quindi dovresti sperimentare dimensioni diverse per i tuoi elementi fino a quando il sito non avrà l'aspetto giusto. Se posso suggerire di non sapere se JS è quello che stai cercando. Puoi semplicemente impostare l'altezza nel foglio di stile CSS con un valore percentuale che sarà sempre impostato correttamente senza leggere la risoluzione dello schermo in JS. – RaYell
http://api.jquery.com/height/ – foxybagga