[JS] Wysokość komórki w IE i pozycja obrazka Opcje

[anadius]

Najpierw zobacz
Problem pojawił się w IE (na Mozilli, Google Chrome i Operze działa dobrze)... A mianowicie chcę pobrać wysokość komórki z tekstem, aby odpowiednio ustawić ten listek po prawej (dokładnie na środku ma być). Użyłem dwóch różnych rozwiązań, jednak oba zawiodły:

[JAVASCRIPT] pobierz, plaintext 
document.getElementById('text').clientHeight;
[JAVASCRIPT] pobierz, plaintext 

i

[JAVASCRIPT] pobierz, plaintext 
document.getElementById('text').offsetHeight;
[JAVASCRIPT] pobierz, plaintext 

('text' to ID komórki z tekstem)
W IE wyświetla 0, w innych przeglądarkach 1052... Czy jest jakiś sposób, żeby działało też w IE?

I kolejny problem w IE, tym razem z pozycją liścia po lewej na dole. Ma atrybuty:

[CSS] pobierz, plaintext 
position: absolute;
left: -150px;
bottom: 0px;
[CSS] pobierz, plaintext 

Dół obrazka liścia powinien być równo z dołem tabelki, która jest wsadzona w diva z:

[CSS] pobierz, plaintext 
position: relative;
[CSS] pobierz, plaintext 

Z tym też nie potrafię się uporać.

[zegarek84]

po pierwsze po co JS skoro można w samym CSS??
po drugie:

In IE 6 contentPane.offsetHeight is not available while the document
is loading. I confirmed this by placing
alert(contentPane.offsetHeight) in a function called report() that is
triggered by the onLoad event.

w samym css to zamień linijki:

Kod

img#leaf { position: absolute; left: -150px; width: 241px; height: 301px; }
img#leaf2 { position: absolute; left: -150px; width: 241px; height: 284px; }
img#leaf3 { position: absolute; right: -170px; width: 329px; height: 267px; }

(skoro znasz wysokość obrazków to nie problem - jakbyś nie znał też jest jeden trick (IMG:style_emoticons/default/winksmiley.jpg) ) na linijki:

[CSS] pobierz, plaintext 
#leaf, #leaf2, #leaf3 {
    position: absolute;
    display: block;
    margin:0px;
    padding:0px;}
#leaf, #leaf2 {
    left: -150px;
    width: 241px;}
#leaf {
    height: 301px;
    bottom: 0px;}
#leaf2 {
    height: 284px;
    top: -130px;}
#leaf3 {
    right: -170px;
    width: 329px;
    height: 267px;
    top:50%;
    margin-top: -133px;}
[CSS] pobierz, plaintext 

co do ostatniego problemu to raczej musisz ustawić padding div'a na 0px (nie chce mi się włączać windowsa ;p )...

pozycje liści są na swoim miejscu bez JS (IMG:style_emoticons/default/winksmiley.jpg)
a i ostatnie o.0:

Kod

txt_height/2-267/2

od kiedy to przypisujemy wartości po pół i skoro to masz w pikselach dlaczego nie jest zakończone +'px'; (IMG:style_emoticons/default/questionmark.gif) [ale to nie potrzebne (IMG:style_emoticons/default/winksmiley.jpg) ]

ps. tak jeszcze dodam jakbyś nie zauważył - tutaj na środku ustawia:

Kod

   top:50%;
    margin-top: -133px;

Ten post edytował zegarek84 9.04.2010, 22:43:25

[anadius]

Po pierwsze: jeśli tekst będzie za krótki, to nie chcę mieć liścia w jego połowie (po prawej), ani nakładających się na siebie (po lewej - jeszcze się napisze kod :P).
Po drugie: dzięki! Działa. ;]
Dzięki za przypomnienie o oszczędności znaków w pliku. :P
Padding div'a nic nie daje. :/

Kod

Math.round((text_height-267)/2) + 'px'

Lepiej tak? xD