zoukankan      html  css  js  c++  java
  • 页面或元素内容滚动到底部

    inputFocus(){
          //监听输入框获得焦点,判断软键盘弹起
          let bodyEle = document.documentElement || document.body;
          this.$nextTick(()=>{
            bodyEle.scrollTop = bodyEle.scrollHeight;
            setTimeout(()=>{//这个计时器是等待dom刷新后 定位完成
              this.$refs.mchat.scrollTop = this.$refs.mchat.scrollHeight;
            },500);
          });
        },

     精确适配

    inputFocus(){
          //监听输入框获得焦点,判断软键盘弹起
          this.$nextTick(()=>{
            setTimeout(()=>{
              this.$refs.mchat.scrollTop = this.$refs.mchat.scrollHeight;
                if( this.windowInitHeight == 460 ){//适配iphone4
                  document.body.scrollTop = this.windowInitHeight - window.innerHeight - 10;
                }else{
                  document.body.scrollTop = this.windowInitHeight - window.innerHeight;
                }
                if(document.body.scrollTop < 1){//若document.body.scrollTop 设置后没生效  则设置document.documentElement.scrollTop
                  document.documentElement.scrollTop = this.windowInitHeight - window.innerHeight;
                }
            },500)
          });
        },

    mounted中 给this.windowInitHeigh 赋值为window.innerHeight

  • 相关阅读:
    Math 和 Date
    GRID布局
    移动端项目布局类型
    媒体查询 + rem用法
    字符串
    ES5 中常见的数组常用方法
    数组的排序
    毕设制作:前端界面 2020-02-01
    阅读笔记十六——排序算法
    阅读笔记十五——阿里面试题
  • 原文地址:https://www.cnblogs.com/fqh123/p/13566858.html
Copyright © 2011-2022 走看看