Ostatnio miałem problemy z wyśrodkowaniem takiego diva:
<div style="position:absolute;" id="mydiv"> zawartość </div>
Z JS udało się go wycentrować.
Do tego diva dopisujemy w CSS left:50%; . Da nam to, że div będzie się zaczynał od połowy naszego ekranu w szerz. Teraz aby div był na środku, należy pobrać z CSS atrybut left w pikselach ( $("#mydiv").css("left").replace(/px/, '') ) , następnie odjąć połowę szerokości naszego diva ( ($("#mydiv").width()/2) ) , zaokrąglić wynik i dopisać do niego "px". Otrzymamy nową wartość, którą należy dopisać atrybutowi left, by ten div był na środku ekranu. Czyli:
$("#mydiv").css("left",Math.round(($("#mydiv").css("left").replace(/px/, ''))-($("#mydiv").width()/2))+"px");
No i to wszystko - div na środku i gitara gra.
Subskrybuj:
Komentarze do posta (Atom)
3 komentarze:
A po co jQuery? Wystarczy sam css.
#pojemnik {
position: absolute;
width: 800 px; /na przykład 800/
height: 600px; /na przykład 600/
left: 50%;
top: 50%;
margin-left: -400 px; /połowa z width/
margin-top: -300 px; /połowa z height/
}
i działa.
wtedy ustalasz juz width. U mnie tak nie moze byc, poniewaz tresc w pojemniku jest dynamiczna, i nie wiem z gory jakie to bedzie szerokie
Witam, mógłbyś pokazać dokładny przykład jego zastosowania, bo kombinuje i mi nie wychodzi. Dzięki i pozdrawiam
Prześlij komentarz