假设有一个div,里面会不断append新的内容,当超过一定高度后会出现滚动条。
但是新内容append后,滚动条的位置始终不变,会在顶部。这种体验很不好,我们希望能够动态调整滚动条位置到最新数据处。
关于滚动条jQuery 提供了一下方法:
-
scrollTop() 方法,可以用来返回或设置匹配元素的滚动条的垂直位置;
-
scrollHeight()方法,获取滚动条高度;
<div id="log-container" style="height: 99%; overflow-y: scroll; background: #333; color: #aaa; padding: 10px;">
<div style="line-height:20px;font-size:17px;"></div>
ws.onmessage = function(event) {
var _data = event.data;
//ceontent
$("#log-container div").append(_data).append("<br/>");
//获取滚动条高度
var sh = $("#log-container").prop("scrollHeight");
//设置滚动条位置
$('#log-container').scrollTop(sh);
//或者加一个动画过渡
$('#log-container').animate({scrollTop:sh},100);
每次新数据append时都会触发滚动条调整位置。
参考:https://www.hangge.com/blog/cache/detail_1360.html
假设有一个div,里面会不断append新的内容,当超过一定高度后会出现滚动条。但是新内容append后,滚动条的位置始终不变,会在顶部。这种体验很不好,我们希望能够动态调整滚动条位置到最新数据处。关于滚动条jQuery 提供了一下方法:scrollTop() 方法,可以用来返回或设置匹配元素的滚动条的垂直位置; scrollHeight()方法,获取滚动条高度;示例:&l...
参考文章:
http://www.jb51.net/article/90185.htm
本文实例讲述了jQuery实现将div中滚动条滚动到指定位置的方法。分享给大家供大家参考,具体如下:一、Js代码:onload = function () {
//初始化
scrollToLocation();
function scrollToLocation() {
var mainCo
scrollTop() 方法返回或设置匹配元素的滚动条的垂直位置scrollLeft() 方法返回或设置匹配元素的滚动条的水平位置<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>滚动条位置的获取与设置</tit
// fater.scrollTop(
// scrollTo.offset().top - fater.offset().top + fater.scrollTop()
// );
// Or you can animate the scrolling:
fater.animate({
scrollTop: scrollTo.offset().top -.
<div id="scroll_table" class="col-md-12 bottom_half" >
<table width="100%">
<thead>
<tr>
//d1是外层div,带滚动条
<div id='d1' style='height:200px;width:100px;overflow:auto;background:blue;'>
<div style='height:500px;width:500px;background:yellow'>2222</div>
</body>
<script>
document
jsondiffpatch介绍
qq_39113035:
java对list集合进行分页
旺来啦!:
asterisk、pbx、sip等基本概念
上海交大坑神:
liquibase介绍
let‘s cb: