방문자가 웹 사이트를 아래로 스크롤 할 때 아래쪽으로 스크롤되는 사이드 바 div가 있습니다. 문제는, 그것이 아래로 줄곧 스크롤하지 않고, 나는 그것이 왜 있는지에 관해 계산했다.jquery scroll div - 페이지가 완전히로드되면 문서 높이를 계산 하시겠습니까?
코드가로드되는 즉시 스크립트에서 문서의 높이를 계산한다고 가정하겠습니다. 그러나 웹 사이트에서 이미지가 계산을 완료 한 후에 아직로드되지 않은 다른 크기로 표시됩니다. 한 번 클릭하면 다른 크기로 주 이미지.
각 이미지의 높이를 설정하면 올바르게 스크롤됩니다. 그러나 라이브 웹 사이트에서 동적으로 생성되는 이미지 크기를 아는 것은 불가능합니다.
모든 이미지가로드 된 후 스크립트가 문서 높이를 계산할 수있는 방법이 있습니까? 아니면 다른 것이 효과가 있을까요? .
var documentHeight = 0;
var topPadding = 15;
$(function() {
var offset = $("#sidebar").offset();
documentHeight = $("#maincontainer").height();
$(window).scroll(function() {
var sideBarHeight = $("#sidebar").height();
if ($(window).scrollTop() > offset.top) {
var newPosition = ($(window).scrollTop() - offset.top) + topPadding;
var maxPosition = documentHeight - (sideBarHeight + 0);
if (newPosition > maxPosition) {
newPosition = maxPosition;
}
$("#sidebar").stop().animate({
marginTop: newPosition
});
} else {
$("#sidebar").stop().animate({
marginTop: 0
});
};
});
});
$ (window) .load (function()')를 사용하여 $ (function()')을 호출하고, DOM을로드 한 직후에 이미지를 포함하는 모든 페이지 에셋을로드 한 후 실행합니다. /stackoverflow.com/questions/8396407/jquery-what-are-differences-between-document-ready-and-window-load – Sparky