弹框在UC浏览器或者Android机器上会被顶上去

可以通过监听resize事件

    this.height = $(document).height();
window.addEventListener('resize', () => {
if (/OPPO|HUAWEI/ig.test(navigator.userAgent)) {
if (document.body.clientHeight < this.height) {
this.hideBottom();
} else {
this.showBottom();
}
} else if (document.body.clientHeight > this.height) {
this.hideBottom();
} else {
this.showBottom();
}
});
}

目前是发现OPPO跟华为的clientHeight跟ios下面的UC浏览器表现不一样,所以做了特殊处理

用了上面的方法之后就是下面的效果了

各位前端的小伙伴如果有更好的方法,一定要告诉我啊!

弹框在UC浏览器或者Android机器上会被顶上去的更多相关文章

  1. jquery-layer弹框在火狐浏览器中弹框不显示的问题

    在使用layer控件设置弹框时, 谷歌浏览器中能正常弹出, 显示在页面中央位置. 而在火狐浏览器中, 弹框只显示标题, 并且弹框内容不显示. 在火狐浏览器中弹框的效果如下图红色方框中的弹出框所示, 但 ...

  2. selenium webdriver从安装到使用(python语言),显示等待和隐性等待用法,切换窗口或者frame,弹框处理,下拉菜单处理,模拟鼠标键盘操作等

    selenium的用法 selenium2.0主要包含selenium IDE 和selenium webDriver,IDE有点类似QTP和LoadRunner的录制功能,就是firefox浏览器的 ...

  3. Android 高仿UC浏览器监控剪切板弹出悬浮窗功能

    UC浏览器应该是android手机里 最流行的浏览器之一了,他们有一个功能 相信大家都体验过,就是如果你复制了什么文字,(在其他app中 复制也有这个效果!,所以能猜到肯定是监控了剪切板),就会弹出一 ...

  4. Android H5混合开发(5):封装Cordova View, 让Fragment、弹框、Activity自由使用Cordova

    近期,有同事咨询如何在Fragment中使用Cordova,看了下Cordova源码,官方并没有提供包含Cordova Webview的Fragment,以供我们继承. 上网查询了一下,也有几篇文章讲 ...

  5. Android填坑系列:在小米系列等机型上放开定位权限后的定位请求弹框

    背景: 近期因实际项目需要,在特定操作下触发定位请求,取到用户位置及附近位置. 问题: 经初步选型,最终决定接入百度定位,按照百度定位SDK Android文档,接入过程相对顺利.但随后发现,在小米系 ...

  6. android仿微信红包动画、Kotlin综合应用、Xposed模块、炫酷下拉视觉、UC浏览器滑动动画等源码

    Android精选源码 仿微信打开红包旋转动画 使用Kotlin编写的Android应用,内容你想象不到 Android手机上的免Root Android系统日志Viewer 一个能让微信 Mater ...

  7. 在iphone的safari浏览器中,拨打电话,出现系统异常弹框

    这是系统级别的问题,暂时无法解决. IPHONE的safari浏览器电话拨打,前两次点击拨打按钮,会正常弹出系统弹框包含(电话号码,取消,呼叫). 第3次往后,点击按钮会出现另一种系统弹框包含(已阻止 ...

  8. 遇到的一个移动端从下往上过渡的弹框,在Android下过渡动画的优化问题。

    优化之前: /* 分享弹框样式 */ .popUpDiv { width: 100vw; height: 100vh; transition: all 0.5s ease; position: fix ...

  9. Android开发之模仿UC浏览器的菜单

    这个内容内容涉及到的了两个知识点: PopupWindow:使用PopupWindow创建一个简单的菜单 使用TabHost创建标签:这个网上好多教程随便看看就好. 实现思路: 观察一下UC浏览器的菜 ...

随机推荐

  1. c#—get,set访问器的作用

    http://blog.sina.com.cn/s/blog_82526aa60100txtx.html 有字段为啥要有属性??? 属性作用: 1.控制读和写的权限 get:读出 set:写入 2.对 ...

  2. html5 postMessage 实现类似 sendMessage 的同步效果,支持跨域

    实现一个客户端发送 “save 一个答案,在获取答案, 跨域的另一个页面中,回调返回”3“的场景. 客户端:请在 http://127.0.0.1/pk/index.html 打开 <html& ...

  3. 安卓开发学习笔记(五):史上最简单且华丽地实现Android Stutio当中Webview控件https/http协议的方法

    一.我们先在XML当中自定义一个webview(Second_layout.xml) 代码如下: <?xml version="1.0" encoding="utf ...

  4. [Swift]LeetCode233. 数字1的个数 | Number of Digit One

    Given an integer n, count the total number of digit 1 appearing in all non-negative integers less th ...

  5. [Swift]LeetCode277. 寻找名人 $ Find the Celebrity

    Suppose you are at a party with n people (labeled from 0 to n - 1) and among them, there may exist o ...

  6. [Swift]LeetCode652. 寻找重复的子树 | Find Duplicate Subtrees

    Given a binary tree, return all duplicate subtrees. For each kind of duplicate subtrees, you only ne ...

  7. Lunix服务器上项目迁移命令

    scp就是security copy,用于将文件或者目录从一个Linux系统拷贝到另一个Linux系统下. scp传输数据用的是SSH协议,保证了数据传输的安全,其格式如下: scp 远程用户名@IP ...

  8. 【Spark篇】---Spark故障解决(troubleshooting)

    一.前述 本文总结了常用的Spark的troubleshooting. 二.具体 1.shuffle file cannot find:磁盘小文件找不到. 1) connection timeout ...

  9. 2.Django路由规则

    路由规则 1.基于正则的url 在templates目录下创建index.html.detail.html文件 (1)index.html <!DOCTYPE html> <html ...

  10. 【Maven】---坐标与依赖

    Maven坐标与依赖 最近想深度学习下maven,找到一本书叫<Maven实战>,这本书讲的确实很好,唯一遗憾的是当时maven教学版本是3.0.0的,而目前已经到了3.5.4了,版本存在 ...