iOS设备,fixed布局出问题
window.deviceId = '{{$deviceId}}';
window.iOS = navigator.userAgent.match(/(iPad|iPhone|iPod)/g) ? true : false;
if( iOS ){
iOSversion = ( !!window.history && !!window.history.pushState ? '4+' : '4-' );
if( !!window.matchMedia ){ iOSversion = '5+'; }
}
window.getViewport = function() { // Note viewport sizing broken in Android 2.x see http://stackoverflow.com/questions/6601881/problem-with-meta-viewport-and-android
var viewport = {
left: window.pageXOffset, // http://www.quirksmode.org/mobile/tableViewport.html
top: window.pageYOffset,
width: window.innerWidth || documentElement.clientWidth,
height: window.innerHeight || documentElement.clientHeight
};
return viewport;
}
在android机器上可以正常提升上来,但是在iOS机器上会出现问题。
在iOS机器上,不通过bottom来始终居底部,而是通过计算top的位置再通过scrollTo来调整位置。
window.timeDelay = 300;
setInterval(function () {
window.scrollTo(0, 0);
}, timeDelay);
iOS设备,fixed布局出问题的更多相关文章
- 移动端踩坑之旅-ios下fixed、软键盘相关问题总结
最近一个项目掉进了移动端的大坑,包括ios下fixed布局,h5唤起键盘等问题,作为一个B端程序员,弱项就是浏览器的兼容性和移动端的适配(毕竟我们可以要求使用chrome),还好这次让我学习了一下相关 ...
- 【前端开发】解决ios设备上fixed浮动的input输入框兼容问题
我们在开发移动端页面时,经常会存在这种需求,在页面顶部或底部有一个输入框,一直浮动在顶部或底部位置,中间部分的内容是可以滚动的.比如底部输入框的搜索功能,或底部输入框的写评论功能. 这种问题,我们一般 ...
- ios设备触发虚拟键盘输入后position:fixed 无效的一些简单另类的解决方法。
首先看一下我要解决的问题,第一张图是正常的情况下,第二张图是点击了输入框之后的情况,就是要解决此问题~! 百度了一下解决方法,好像有以下的一些方法: 1. iscroll 2. Jquery Mobi ...
- ios中fixed元素在滚动布局中的延时渲染问题
在之前做的一个demo中,有个视图是内滚动的,里边有个bar用了fixed,不是fixed在最外层视图的顶部和底部,在微信/safari/chrome/其他浏览器app上都没出现问题. 然后今天,我把 ...
- 【转载】Web移动端Fixed布局的解决方案
特别声明:本文转载于EFE的<Web移动端Fixed布局的解决方案>.如需转载,烦请注明原文出处:http://efe.baidu.com/blog/mobile-fixed-layout ...
- 移动端网页fixed布局问题解决方案
问题说明 移动端web的footer常常设计为fixed布局,但是在页面键盘被拉起时fixed的布局会出现问题,自己试了下,在较低版本ios和部分安卓机上会有此问题.具体问题看图示: <body ...
- Web移动端Fixed布局的解决方案
移动端业务开发,iOS 下经常会有 fixed 元素和输入框(input 元素)同时存在的情况. 但是 fixed 元素在有软键盘唤起的情况下,会出现许多莫名其妙的问题. 这篇文章里就提供一个简单的有 ...
- [转] Web移动端Fixed布局的解决方案
移动端业务开发,iOS 下经常会有 fixed 元素和输入框(input 元素)同时存在的情况. 但是 fixed 元素在有软键盘唤起的情况下,会出现许多莫名其妙的问题. 这篇文章里就提供一个简单的有 ...
- 八、Web移动端Fixed布局的解决方案
移动端业务开发,iOS 下经常会有 fixed 元素和输入框(input 元素)同时存在的情况. 但是 fixed 元素在有软键盘唤起的情况下,会出现许多莫名其妙的问题. 这篇文章里就提供一个简单的有 ...
随机推荐
- 一份快速实用的 tcpdump 命令参考手册
对于 tcpdump 的使用,大部分管理员会分成两类.有一类管理员,他们熟知 tcpdump 和其中的所有标记:另一类管理员,他们仅了解基本的使用方法,剩下事情都要借助参考手册才能完成.出现这种情况 ...
- HDU 2462 The Luckiest number
The Luckiest number Time Limit: 1000ms Memory Limit: 32768KB This problem will be judged on HDU. Ori ...
- hdu 2669 扩展欧几里得(裸)
#include<stdio.h> #include<iostream> #define ll __int64 ll gcd(ll a,ll b,ll &x,ll &a ...
- HDU 5668 Circle
中国剩余定理. 可以手动模拟一下每一次开始的人的编号和结束的人的编号. 每次删掉一个人,对剩下的人重新编号. 这样一次模拟下来,可以得到n个方程 形如:(u[i]+k)%(n-i+1)=v[i] 化简 ...
- 编译.net .net Core程序 代码,仅做备份
//创建一个ProcessStartInfo对象 使用系统shell 指定命令和参数 设置标准输出 //编译.net core项目 var psi = new ProcessStartInfo(&qu ...
- Jquery操作事件
1.文档加载事件 2.DOM单击双击事件 3.DOM获得焦点,失去焦点问题 4.DOM鼠标移入,移出事件 <!DOCTYPE html> <html> <head> ...
- poj 3041——Asteroids
poj 3041——Asteroids Time Limit: 1000MS Memory Limit: 65536K Total Submissions: 22604 Accep ...
- java基础编程题
1. 某公司每月标准上班时间是160小时,每小时工资是30元. 如果上班时间超出了160小时,超出部分每小时按1.5倍工资发放.请编写程序计算员工月工资. package com.num2.lianx ...
- Free命令详解和释放linux Cache(转载)
因为LINUX的内核机制,一般情况下不需要特意去释放已经使用的cache.这些cache起来的内容可以增加文件以及的读写速度. 先说下free命令怎么看内存 [root@yuyii proc]# fr ...
- WinCE5.0如何安装.NET3.5
首先去微软官网下载.NET Compact Framework 3.5 Redistributable 点击下载 下载页面 一共有两种安装方式,我们先介绍常规的安装方式 1.设备连接到电脑,然后双击下 ...