zoukankan      html  css  js  c++  java
  • js滚动条到最底端控制制作聊天室必备

    当聊天室的内容超出页面范围时,
    如何让页面刷新后
    显示最下面的内容

    document.getElementById ( 'chatboard').scrollTop=document.getElementById ( 'chatboard').scrollHeight ;

    chatboard 为显示容器的id

    滚动样式:
    <STYLE>
    BODY {
    SCROLLBAR-FACE-COLOR: #f892cc;
    SCROLLBAR-HIGHLIGHT-COLOR: #f256c6;
    SCROLLBAR-SHADOW-COLOR: #fd76c2;
    SCROLLBAR-3DLIGHT-COLOR: #fd76c2;
    SCROLLBAR-ARROW-COLOR: #fd76c2;
    SCROLLBAR-TRACK-COLOR: #fd76c2;
    SCROLLBAR-DARKSHADOW-COLOR: #f629b9;
    SCROLLBAR-BASE-COLOR: #e9cfe0
    }
    </STYLE> 代码说明:
    SCROLLBAR-FACE-COLOR: 滚动条凸出部分的颜色
    SCROLLBAR-HIGHLIGHT-COLOR: 滚动条空白部分的颜色
    SCROLLBAR-SHADOW-COLOR: 立体滚动条阴影的颜色
    SCROLLBAR-3DLIGHT-COLOR: 滚动条亮边的颜色
    SCROLLBAR-ARROW-COLOR: 上下按钮上三角箭头的颜色
    SCROLLBAR-TRACK-COLOR: 滚动条的背景颜色
    SCROLLBAR-DARKSHADOW-COLOR: 滚动条强阴影的颜色
    SCROLLBAR-BASE-COLOR:

    JS控制滚动条的位置:
    window.scrollTo(x,y);

    竖向滚动条置顶(window.scrollTo(0,0);
    竖向滚动条置底 window.scrollTo(0,document.body.scrollHeight)

    JS控制TextArea滚动条自动滚动到最下部

    document.getElementById('textarea').scrollTop = document.getElementById('textarea').scrollHeight;

  • 相关阅读:
    Cesium中监听MOUSE_MOVE事件获取经纬度和高度
    CentOS系统重命名
    docker安装步骤
    nginx发布vue 项目
    解决git 本地代码与远程仓库冲突问题
    js通过className删除元素
    bootstrap treeview基本运用
    自定义组件模拟v-model
    使用a标签下载**.txt文件, 而不是直接打开
    mongoose 开源http库
  • 原文地址:https://www.cnblogs.com/zxjyuan/p/1827922.html
Copyright © 2011-2022 走看看