Position: fixed 在IOS上的显示效果

会出现两种情况:

  • 点击fixed定位的元素会出现fixed定位失效导致的元素贴向底部，即position: absolute，bottom: 0px;的情况

  • 点击fixed定位的元素，元素向上移，定位生效，位置偏移大

解决方案 - 仅针对Safari

给fixed定位元素设置一个点击事件，在点击事件会调函数中加入 window.scrollTo(0, document.body.scrollHeight); (将页面视口定位至页面底部)，然后改变改定位元素的css class，把 position: fixed ==> position: absolute，这样，我们就可以很快的解决fixed定位导致的前两类Bug，当然，如果定位元素是Input标签，别忘了增加 blur 事件在失去聚焦后把css class改回。

其他解决方案

http://efe.baidu.com/blog/mobile-fixed-layout/

最新文章

  1. Model & ModelMap & ModelAndView 比较ModelFactory简介
  2. C# 小例子
  3. Linux下搭建nginx php环境
  4. synchronized的理解
  5. Android之EditText文本变化的监听
  6. Web前端新人笔记之CSS结构和层叠
  7. 用Delphi画圆角Panel的方法（使用CreateRoundRectRgn创造区域，SetWindowRgn显示指定区域）
  8. --@angularJS--指令与控制器之间较复杂的交互demo2
  9. Python编程快速上手——让繁琐工作自动化学习笔记
  10. php学习笔记位运算
  11. Beta No.4
  12. Hadoop API：遍历文件分区目录，并根据目录下的数据进行并行提交spark任务
  13. js生成带logo的二维码
  14. 572. Subtree of Another Tree（easy）
  15. 使用Java程序读取JPG Tif等格式图片的exif信息
  16. JDK和CGLIB动态代理区别
  17. Python学习（六） —— 函数
  18. 时空CLR解密登陆密码源码
  19. 一个基于netty的websocket聊天demo
  20. WebForm - 文本框回车事件

热门文章

  1. Shell 相互调用
  2. css text-align文字两端对齐
  3. 异常处理：net.sf.cglib.beans.BulkBeanException
  4. go程序性能测量和分析
  5. 数据存储之属性列表Plist
  6. 在Java8的foreach()中不能break，如果需要continue时，可以使用return
  7. .2-浅析express源码之applicaiton模块(1)-咸鱼方法
  8. Docker基础-搭建本地私有仓库
  9. [日常] Go语言圣经--示例: 并发的Echo服务
  10. Shiro眼皮下玩ajax，玩出302 Found