当前位置: 首页 > news >正文

检测是否支持position:fixed

不喜欢浏览器嗅探,模仿IE6的UA的浏览器太多了


  
/*
* 使用如下结构:
* <div style="position: absolute; top: 200px;"> <== outer
* <div style="position: fixed; top: 100px;"></div> <== inner
* </div>
*
* 如果浏览器支持fixed,由于fixed是相对于document定位的,因此无论body样式如何,top始终是100px
* 如果浏览器不支持fixed,被解释为static,则inner和top值无效,计算出来的inner的绝对top与outer相同
*/
var outer = document.createElement( ' div ' ),
inner
= document.createElement( ' div ' ),
result
= true ;

outer.style.position
= ' absolute ' ;
outer.style.top
= ' 200px ' ;

inner.style.position
= ' fixed ' ;
inner.style.top
= ' 100px ' ;

outer.appendChild(inner);
document.body.appendChild(outer);

if (inner.getBoundingClientRect &&  
inner.getBoundingClientRect().top == outer.getBoundingClientRect().top ) {
result
= false ;
}

转载于:https://www.cnblogs.com/GrayZhang/archive/2011/02/17/detect-position-fix.html

相关文章:

  • [译]学习IPython进行交互式计算和数据可视化(三)
  • 【PSY】 [歌詞] 父親
  • 一步一步学Remoting之三:复杂对象
  • linux下查看磁盘空间
  • Greenplum table 之 appendonly的列存储表
  • 云计算实验(二)Hadoop 练习
  • 云计算实验(三)CloudSim练习
  • 信息安全实验一:DES分组密码算法 2019.03.21
  • 信息安全实验二:分组密码工作模式 2019.04.15
  • 信息安全实验三:求模逆算法 2019.04.18
  • 信息安全实验四:RSA公钥加密算法 2019.04.28
  • 信息安全实验五:散列算法 2019.05.18
  • 信息安全实验六:RSA数字签名算法 2019.06.01
  • 基于寒武纪平台的边缘智能实践课程-实验报告 2019.7.5
  • 基于深度学习的实时人脸识别 2019.3.6
  • 「前端」从UglifyJSPlugin强制开启css压缩探究webpack插件运行机制
  • JavaScript 基础知识 - 入门篇(一)
  • Java超时控制的实现
  • JS函数式编程 数组部分风格 ES6版
  • MyEclipse 8.0 GA 搭建 Struts2 + Spring2 + Hibernate3 (测试)
  • OSS Web直传 (文件图片)
  • PAT A1092
  • Promise面试题2实现异步串行执行
  • React Transition Group -- Transition 组件
  • spring学习第二天
  • vue-cli在webpack的配置文件探究
  • WePY 在小程序性能调优上做出的探究
  • 程序员该如何有效的找工作?
  • 初识 webpack
  • 记一次用 NodeJs 实现模拟登录的思路
  • 解析带emoji和链接的聊天系统消息
  • 开源地图数据可视化库——mapnik
  • 使用 5W1H 写出高可读的 Git Commit Message
  • media数据库操作,可以进行增删改查,实现回收站,隐私照片功能 SharedPreferences存储地址:
  • 格斗健身潮牌24KiCK获近千万Pre-A轮融资,用户留存高达9个月 ...
  • ​​​​​​​GitLab 之 GitLab-Runner 安装,配置与问题汇总
  • ​html.parser --- 简单的 HTML 和 XHTML 解析器​
  • #100天计划# 2013年9月29日
  • #define用法
  • (175)FPGA门控时钟技术
  • (Forward) Music Player: From UI Proposal to Code
  • (MonoGame从入门到放弃-1) MonoGame环境搭建
  • (编译到47%失败)to be deleted
  • (附源码)springboot工单管理系统 毕业设计 964158
  • (附源码)ssm捐赠救助系统 毕业设计 060945
  • (附源码)计算机毕业设计大学生兼职系统
  • (三分钟)速览传统边缘检测算子
  • (原創) 如何優化ThinkPad X61開機速度? (NB) (ThinkPad) (X61) (OS) (Windows)
  • .Net Winform开发笔记(一)
  • .Net下使用 Geb.Video.FFMPEG 操作视频文件
  • @RequestBody详解:用于获取请求体中的Json格式参数
  • @selector(..)警告提示
  • @staticmethod和@classmethod的作用与区别
  • [<事务专题>]
  • [14]内置对象