Niezawodnie zwracaj element scrollHeight bez używania właściwości `scrollHeight`.

Question

Używając zwykłego kodu JavaScript lub jQuery, potrzebuję uzyskać pełną wysokość przewijanego elementu. Ale własność DOM scrollHeightis apparently not 100% reliable.

byłem przewidując tymczasowo nadając artykuł wysokość CSS auto, sprawdzanie jego rozmiar, a następnie powrót do CSS do jego wcześniejszej wartości (która sama ma problemy - w jaki sposób mogę uzyskać css height:100% zamiast height:1012px jak jQuery .css('height') wróci). Ale wtedy zorientowaliśmy się, że ze względu na sposób jQuery stosuje css stylizacji bezpośrednio do elementu, po prostu stosując styl '' odsyła go do swojej normalnej style-sheet-zadeklarowanej wartości, więc teoretycznie mógłbym to zrobić:

$el.css('height', 'auto'); 
scrollHeight = $el.height(); 
$el.css('height', ''); 

Ale to nie działa. height:auto nie zastępuje oryginalnego stylu mojego elementu 100% i sprawia, że ​​element zajmuje całą żądaną wysokość.

Teraz myślę o czymś więcej w tym kierunku: użyj pozycji pierwszego wierzchołka elementu potomnego i pozycji ostatniego elementu potomnego, aby uzyskać wysokość. (Można regulować za padding i marginesu, jeżeli jest to konieczne, to jest tylko proof of concept.)

function scrollHeight($el) { 
    var lastEl = $el.children(':last'); 
    return (
     lastEl.position().top 
     + lastEl.height() 
     - $el.children(':first').position().top; 
    ); 
} 

Niektóre z pracy w Math.max($el[0].scrollHeight, $el.height()) może być również użyteczny ...

Czy to okropny pomysł? Nie mogę być jedyną osobą, która kiedykolwiek potrzebowała znać scrollHeight elementu DOM i mieć pewność, że nie jest zmienna, gdy przedmiot jest przewijany, i działa we wszystkich głównych przeglądarkach, a także w IE 8 (chociaż byłaby to interesujące znać rozwiązanie dla IE 6 & 7).

Answer 1

Zamiast

$el.css('height', 'auto');

Try -

$el.attr('style', 'height: auto !important');

Wspominam próbuje to becuase wam powiedzieć -

height: auto nie jest nadrzędne oryginał mojego elementu styl 100% i czyniąc element zajmujący pełną pożądaną wysokość.