Salve,
vorrei fare un controllo sulla finestra del browser in modo tale che, se il size della finestra è maggiore di N px (larghezza, altezza) allora si attiva un foglio di stile altrimenti no. Qualcuno sa il codice javascript che va inserito?
Saluti, grazie....
Denis
mmm io farei du fogli di stile diversi solo dal fatto che se il body ha o meno la class Large.
Es:
a questo punto se nel body c'è la class Large verranno attivate le ultime due regole, altrimenti le prime due.codice:body{ font-size: 11px; } #MyID{ width: 650px; } body.Large{ font-size: 12px; } .Large #MyID{ width: 850px; }
a questo punto al caricamento della Pagina controlli la dimensione della window e aggiungi o togli la classe al body in base alla dimensione.
un paio di link utili:
http://www.geekdaily.net/2007/07/04/...and-centering/
http://snipplr.com/view/3561/addclas...lass-hasclass/
Dovresti avere tutto quello che ti serve.
I DON'T Double Click!
Grazie per la risposta.
Giusto per capire meglio il mio problema.
Al maincontainer ho messo questo css:
height:590px;
left:50%;
margin-left:-475px;
margin-top:-295px;
position:absolute;
top:50%;
width:950px;
solo che quando la finestra è inferiore a 950px X 590px la scroll bar del browser non si abilita e i contenuti tendono ad essere nascosti (causa finestra più piccola delle misure standard definite), il tutto perchè il browser tende a centrare in base al resize della pagina il container. Si insomma spero di essermi spiegato abbastanza. Qualcuno di voi puo' darmi una soluzione ottimale?
Saluti
Denis
scusa, ma perché metti i margin left e top?
I DON'T Double Click!
E' una box fissa, e viene centrata all'interno della pagina in base al size della finestra.
Quello mi pare giusto!
Saluti
Denis
P.S.: altrimenti il px (0,0) della mia box sarebbe esattamente al centro della finestra ...e a me non va bene... io voglio la box centrata.
io chiamerei nella funzione onLoad del body
una funzione js di controllo
che controlli le dimenzioni
es:
alla funzione passo l'id dell form iniziale o quello che sia
e quindi cambi il css che avrai opportunamente sistemato in base alle dimensioni.codice:function testDimensioni(idElement){ if (document.getElementById(idElement).style.width>(quello che vuoi)) document.getElementById(idElement).setAttribute("class", "myClass"); }
Grazie per la possibile soluzione! E' anche vero, ditemi se baglio, che se il resize di pagina viene effettuato dopo il caricamento, nel modo sopra citato il css che causa finestra ridotta non si è attivato, non si attiva se non dopo il ricaricamento della pagina giusto?
Qualche soluzione per fare in modo che durante il resize e onload venga effettuato il controllo?
Thanks
Denis
Prendendo spunto da quanto postato sopra ho provato a realizzare una piccola demo che onload in base al size della finestra dovrebbe (ma non funzica) cambiare il colore dello sfondo al body.
Posto il codice.....
WINDOW.SIZE.JS
Codice PHP:window.size = function() { var w = 0; var h = 0; //IE if(!window.innerWidth) { //strict mode if(!(document.documentElement.clientWidth == 0)) { w = document.documentElement.clientWidth; h = document.documentElement.clientHeight; } //quirks mode else { w = document.body.clientWidth; h = document.body.clientHeight; } } //w3c else { w = window.innerWidth; h = window.innerHeight; } return {width:w,height:h}; } window.center = function(){ if (this.window.size.width>(200)) document.getElementById("prova").setAttribute('background','red'); }
PAGE_HTML
Help Meeee ..... dove sbaglio?Codice PHP:<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html> <head> <title></title> <script type="text/javascript" src="Window.Size.js"></script> <style> #provetta{ background:#ffffff;} </style> </head> <body id="prova" onload="window.center()"> blaaaaa </body> </html>
Grazie in anticipo
Denis
Permessi di invio
Rispondi quotando