0

#header が渡された後、ページの高さに沿って #container をフローティングするための JavaScript があります。ここで、#footer div (または、パディングがあるため、その親 div) に到達して固定フローティングを停止したいと考えています。#footer の高さは 800px を超えているため、#container は #footer に触れて上部余白の値を失い、フローティング div なしでページをスクロールし続ける必要があります。ありがとうございました！

    $(window).scroll(function() {
    if ($(window).scrollTop() >= 300) {
        screenWidth = $(window).width();
        containerWidth = $("#content-4").outerWidth(true);
        pos = screenWidth - containerWidth;
        $("#content-5").css({
            position: 'fixed',
            left: 'auto',
            top: '20px'
        });
    }
    else {
        $("#content-5").css({
            position: 'absolute',
            left: '20px',
            top: '20px'
        });
    }
});
4

2 に答える 2

0

フッターに高くz-index、コンテンツに低いものを与える

http://jsfiddle.net/vErBy/4/

#content {
height:200px;
width:400px;
position: fixed;
z-index: 1;
background-color:red;
}

#footer {
position: relative;
top:500px;
bottom: 0;
width:400px;
right: 0;
height: 800px;
z-index: 1;
background-color:blue;
}
于 2013-08-08T11:58:52.930 に答える