Domyślnie wysokość DIV jest określana na podstawie jego zawartości.
Ale nadpisuję to i jawnie ustawiam wysokość za pomocą jQuery:
$('div#someDiv').height(someNumberOfPixels);
Jak mogę to odwrócić? Chcę usunąć styl wysokości i przywrócić mu automatyczną / naturalną wysokość?
Odpowiedzi:
aby usunąć wysokość:
$('div#someDiv').css('height', ''); $('div#someDiv').css('height', null);
jak wskazał John, ustaw wysokość na
auto
:$('div#someDiv').css('height', 'auto');
(sprawdzone w jQuery 1.4)
źródło
null
nie.$('div#someDiv').height('auto');
Lubię to używać, ponieważ jest to symetryczne ze sposobem, w jaki jawnie użyłeś .height (val), aby ustawić go w pierwszej kolejności, i działa w różnych przeglądarkach.
źródło
może coś takiego
$('div#someDiv').css("height", "auto");
źródło
możesz spróbować tego:
$('div#someDiv').height('');
źródło
Aby zresetować wysokość elementu div, po prostu spróbuj
$("#someDiv").height('auto');
źródło
$('div#someDiv').css('height', '');
źródło
aby dodać do odpowiedzi tutaj, użyłem wysokości jako funkcji z dwiema opcjami albo określ wysokość, jeśli jest mniejsza niż wysokość okna, albo ustaw ją z powrotem na auto
var windowHeight = $(window).height(); $('div#someDiv').height(function(){ if ($(this).height() < windowHeight) return windowHeight; return 'auto'; });
Musiałem wyśrodkować zawartość w pionie, jeśli była mniejsza niż wysokość okna, albo pozwolić jej przewijać się naturalnie, więc to jest to, co wymyśliłem
źródło
Dziękuję wszystkim za pokazanie tych wszystkich przykładów. Po wypróbowaniu przykładów nadal miałem problemy z moją stroną kontaktową na małych ekranach multimedialnych, takich jak poniżej 480 pikseli. Bootstrap ciągle się wsuwał
height: auto
.Inspektor elementów / Devtools pokaże wysokość w:
element.style { }
W moim przypadku widziałem:
section#contact.contact-container | 303 x 743
w oknie przeglądarki.Tak więc następująca pełna długość działa w celu wyeliminowania problemu:
$('section#contact.contact-container').height('');
źródło
$('div#someDiv').removeAttr("height");
źródło
height="XX"
atrybut HTML