Kā vertikāli iecentrēt Containeri neatkarīgi no izšķirtspējas?

[Huselius]

Sveiki, man ir tāda problēma - Container div ir fiksēts augstums, kas ir pietiekami īss, lai rastu problēmu uz lielākiem/kantainiem ekrāniem ar attiecīgi izšķirtspēju. Pagarināt es to nevaru, jo tad cietīs viss dizains, kuru pārtaisīt prasītu visu darbu sākt no sākuma. Sapratu, ka vizuāli visnormālāk izskatītos, ja gadījumos, kad ekrāns ir garāks par Containeri, tad šis div stāvētu pa vidu vienādā attālumā no top un bottom. Pašlaik ir tā, ka viņš ir pielipis pie pašas augšas un zem div ir paliels tukšums.

Ar CSS es šo nevaru labot, jo spēlējoties ar top 50% un tad mīnusot no topa pusi containera izmēra, problēmas rodas, kad atver lapu uz platekrāna, jo tad ir nošķērēta augša, kurai nevar piekļūt klāt.

 

Respektīvi, vai kāds lūdzu varētu padalīties ar javascript kodu, kas manu Containeri vienmēr noliktu vertikālu centrā vienādi starp augšu un apakšu gadījumos, kad ekrāns ir garāks par containeri?

 

Paldies.

[mad182]

if(kontenera_augstums < loga_augstums) {

konteneris_top = (loga_augstums-kontenera_augstums)/2

}

[codez]

principā mad182 ir pareize, tikai vēl vajag pārbaudi, kad elements ir lielāks par ekrānu, plus es vēl to iewrapotu jquery pluginā, lai citreiz arī noder.

 

http://jsfiddle.net/Z7bER/

 

(function($){
$.fn.center= function(options) {
 var
wh=$(window).height(),  
ww=$(window).width();
 return this.each(function() {
var
 	th=$(this).outerHeight(),
 	tw=$(this).outerWidth();
$(this).css({
   	position:"absolute",
   	top: wh>th?(wh-th)/2+"px":"0",
   	left: ww>tw?(ww-tw)/2+"px":"0",
});  
 });
};
})(jQuery);

Edited October 14, 2011 by codez

[Huselius]

paldies, man, nejēgam, vēl tikai ir jāpaskaidro kur šo kodu ielikt - vai head?, jo vairāk neko par to, ka javascripts sākas ar <script type="text/javascript"> un beidzas ar </script>, nezinu. Un vēl, Codez, vai man Tavā garajā kodā ir jāliek kaut kādas vērtības, vai šo kodu varu copy/paste ielikt un viss?

[codez]

plugina daļa ir tas, kas starp:

 

(function($){
...
})(jQuery);

 

to liek kādā inklūdojamā js failā, var jau likt arī starp script tagiem, tikai lieki trafiku tērēs

 

savukār jquery pluginu izsauc ar $('#panel').center(); un to vajag ielikt onload funkcijā aptuveni šādi:

$(function(){
$('#panel').center();
});

[daGrevis]

$(function() {

   // mērce

});

 

'mērce' vietā rakstam visu kodu, kurš ņemas ap DOM (nodes & tree). Tas ir, visi eventi, pluginu & funkciju izsaukumi utml..

 

Tas, kas ir ap 'mērce' ir jQuery snippets, kurš attiecīgo kodu izpildīs tikai tad, ka DOM būs pilnībā ielādējies.

[Huselius]

paldies, ekrāns tagad ir centrā, bet radusies jauna problēma. Biju uzlicis lightbox bilžu rādīšanas javascriptu. Tas tagad nestrādā un bildes rāda tā kā parasti. Lightbox strādā tad, kad noņemu no jūsu augstāk dotā jquery source atsauci uz library linku, taču tad atkal jquery nestrādā. What now?