Nigdy wcześniej nie miałem tego problemu, ale nie mogę znaleźć rozwiązania, więc mam nadzieję, że możecie mi pomóc.jQuery height() nie zmienia się przy zmianie rozmiaru
jQuery
function setTheHeight() {
if($('#main.level1 .block.attention .block-content').length) {
//Get value of highest element
var maxHeight = Math.max.apply(Math, $('#main.level1 .block.attention .block-content').map (
function() {
return $(this).height();
}
));
console.log(maxHeight);
$('#main.level1 .block.attention .block-content').height(maxHeight);
}
}
setTheHeight();
$(window).resize(function() {
setTheHeight();
});
Basicly co robi ta funkcja jest sprawdzić na najwyższym div i ustawić wysokość wszystkich wybranych div do tej wysokości. To działa dobrze. ALE jest to responsywna konstrukcja, więc gdy użytkownik zmienia rozmiar swojej przeglądarki, zawartość staje się mniejsza, a div wyższy. Więc dodałem zdarzenie zmiany rozmiaru. Wydarzenie jest wystrzeliwane, ale nie zmienia wysokości. Jakiś pomysł, dlaczego zmiana rozmiaru nie zmienia wysokości?
Szybkie jsFiddle pokazać, co się dzieje: http://jsfiddle.net/3mVkn/
FIX
Hmm to było po prostu głupie. Ponieważ ustawiałem wysokość(), było już ustalone, więc wystarczy tylko zresetować wysokość i zadziałało.
Zaktualizowany kod:
function setTheHeight() {
if($('#main.level1 .block.attention .block-content').length) {
//Reset height
$('#main.level1 .block.attention .block-content').height('auto');
//Get value of highest element
var maxHeight = Math.max.apply(Math, $('#main.level1 .block.attention .block-content').map (
function() {
return $(this).height();
}
));
console.log(maxHeight);
$('#main.level1 .block.attention .block-content').height(maxHeight);
}
}
setTheHeight();
$(window).resize(function() {
setTheHeight();
});
Cześć Dennis, dziękuję za odpowiedź. Niestety nie udało się rozwiązać problemu :( – Sjors
Tak, masz rację. Sprawdź poprawkę, dostarczyłem poprawne rozwiązanie. –