将页脚粘贴到页面底部

Question

当它的父 div 到达浏览器底部时，我需要冻结页脚面板。

我尝试的是让它在我滚动页面时冻结，但当父父 div 到达浏览器底部时我需要它。

例如，在我的演示中，有一个隐藏的内容面板。如果您单击展开链接，您将看到展开的内容。

当此内容展开时，bottom_content div 移动到底部，我需要其中的 footer div 在bottom_content 被按下后立即粘在底部。

这是我目前使用的代码

var stickyHeaderbottom = $('.footer').offset().top;

    $(window).scroll(function () {
        if ($(window).scrollTop() > stickyHeaderbottom) {
            $('.footer').css({ position: 'fixed', bottom: '0px', width: '95%', left: '2.5%' });
        } else {
            $('.footer').css({ position: 'static', bottom: '0px', width: '100%' });

        }
    });

DEMO

Answer 1

**希望这是你想要达到的目标...DEMO

$('.expandble_conetnt a').click(function(event){
        event.preventDefault();
        $(this).next('span').slideToggle();          
    }); 

//this is for stick to the bottom
var stickyHeaderbottom = $('.footer').offset().top;

    $(window).scroll(function () {
        if ($(window).scrollTop() > stickyHeaderbottom) {
            $('.footer').css({ position: 'fixed', bottom:0, width: '95%', left: '2.5%' });
        } else {
            $('.footer').css({ position: 'static', bottom: $('.expandble_conetnt').offset().top, width: '100%' });

        }
    });