[英]how to scroll to bottom of a div
我想滾動到div content-main
的底部,以便將Button
顯示在bottom of the window
的bottom of the window
。 我嘗試了以下方法:
<div class="container">
<div class="content-main">
dynamic content dynamic content.....
<button>Button </button>
</div>
<div class ="footer"></div>
</div>
<script>
var mainContentHeight = $(".content-main").height();
var footerHeight = $(".content-footer").height();
window.scrollTo(0, mainContentHeight - footerHeight);
</script>
當我在具有不同尺寸的兩台顯示器中對其進行測試時,其工作原理有所不同。 如何在窗口底部顯示按鈕?
而是將scrollTo綁定到window對象,將其綁定到要滾動的元素:
var container = $('.container')[0]; var contentMain = $('.content-main')[0]; var mainContentHeight = $(".content-main").height(); var footerHeight = $(".content-footer").height(); container.scrollTo(0, mainContentHeight - footerHeight);
.container { overflow: auto; height: 100px; } .content-main { height: 100%; position: relative; border: 1px solid #000; height: 1000px; } .content-footer { height: 50px; } button { position: absolute; bottom: 0; }
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <div class="container"> <div class="content-main"> dynamic content dynamic content..... <button>Button </button> </div> <div class="content-footer"></div> </div>
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.