jquery - 如何在页面底部显示/隐藏 div(粘性页脚打开和关闭)

Question

我想在我的页面底部创建一个更新日志，它可以打开(显示)和关闭(隐藏，只有一个小箭头或“更新日志”按钮以便再次显示)

这是 div 的代码(完整页面 View 更准确):

.index_changelog {
    background-color: #222222;
    font: normal normal bold 2em/normal "Arial", Helvetica, sans-serif;
    text-align: center;
    color: rgb(64, 126, 196);
    resize: none;
    border: black;
    border-bottom: blue 1em;
    overflow-y: scroll;
    overflow-x: hidden;
    height: 100px;
    width: 95%;
    position: fixed; 
    bottom: 0; 
}

<div class = "footer">
          <textarea class="index_changelog" allign="center" readonly="readonly">
    SOME TEXT HERE
    SOME TEXT HERE
    SOME TEXT HERE
    SOME TEXT HERE
    SOME TEXT HERE
          </textarea>
      </div>

Answer 1

有几种方法可以做到这一点。使用 JQuery，只需切换一个类即可将页脚定位在正文元素内。

有点像

$('.showMe').click(function(){
    $('.index_changelog').toggleClass('bottom');
});

http://codepen.io/nallenanderson/pen/ONEpRb

你可以通过添加到你的 .index-changelog 来稍微修饰一下

transition: all 0.3s ease-in-out;