完美解决fixed 水平居中问题
群里的朋友问的,发现自己没写过;就写了下,原理和网上的fixed上下左右四个角的原理一样!
1、防止页面振动:
body{
_background-image: url(about:blank);
_background-attachment: fixed;
}
2、水平垂直居中:
div{
width:100px;
height:100px;
background:#999;
position:fixed;
top:50%;
left:50%;
margin-left:-50px;
margin-top:-50px;
position: absolute;
_left:expression(eval(document.documentElement.clientWidth/2 + document.documentElement.scrollLeft - this.offsetWidth/2 - parseInt(this.currentStyle.marginLeft,10) - parseInt(this.currentStyle.marginRight,10))) ;
_top:expression(eval(document.documentElement.clientHeight/2 + document.documentElement.scrollTop - this.offsetHeight/2 - parseInt(this.currentStyle.marginTop,10) - parseInt(this.currentStyle.marginBottom,10)));
}
处理了有margin,border的情况下
很简单的例子,复习了下js里面的盒子模型
完美解决fixed 水平居中问题的更多相关文章
- IE6完美解决fixed方法
ie6对position:fixed不支持,网上有很多解决方法,有的在ie6,ie7上调试成功后,在ie8上又不好使,div层还是跟随滚动条浮 动:以下总结方法,在ie6,ie7,ie8上都调试成功, ...
- 完美解决 Phonegap jQeuryMobile 闪屏 问题
在切换page或者弹出dialog时,会出现闪屏情况,综合网络上各种方法,得出以下方法可完美解决: 1.首先界面页面切换闪屏: 在加载jQuery后,加载jQuery Mobiel之前,插入js语句进 ...
- 完美解决了span的宽度设置
下 面代码的CSS定义完美解决了span的宽度设置问题.由于浏览器通常对不支持的CSS属性采取忽略处理的态度,所以最好将display:inline -block行写在后面,这样在Firefox里面, ...
- emlog通过pjax实现无刷新加载网页--完美解决cnzz统计和javascript失效问题
想要更详细了解pjax,需要查看官网 或者看本站文章:jQuery.pjax.js:使用AJAX和pushState无刷新加载网页(官网教程中文翻译) 效果看本站,音乐无刷新播放,代码高亮和复制js加 ...
- 完美解决,浏览器下拉显示网址问题 | 完美解决,使用原生 scroll 写下拉刷新
在 web 开发过程中我们经常遇到,不想让用户下拉看到我的地址,也有时候在 div 中没有惯性滚动,就此也出了 iScroll 这种关于滚动条的框架,但是就为了一个体验去使用一个框架好像又不值得,今天 ...
- 完美解决IE(IE6/IE7/IE8)不兼容HTML5标签的方法
完美解决IE(IE6/IE7/IE8)不兼容HTML5标签的方法 HTML5的语义化标签以及属性,可以让开发者非常方便地实现清晰的web页面布局,加上CSS3的效果渲染,快速建立丰富灵活的web页 ...
- 完美解决 Linux 下 Sublime Text 中文输入
首先,我参考了好几篇文章,都是蛮不错的,先列出来: sublime-text-imfix:首先推荐这个方法,最简单,但是在我的系统上有些问题.可用这个的强烈推荐用这个 完美解决 Linux 下 Sub ...
- Linux安装软件时缺少依赖包的简单较完美解决方法!
大家在linux下源码安装时,有木有经常碰到缺少这个包那个包的,然后不知所措?看到最近有几个筒子安装thrift,安装python因缺少依赖包而进行不下去了.我用的是红帽,装系统的时候习惯把所有的有的 ...
- MacBook Pro/Air 下使用 linux ubuntu 系统 波浪号“~”变成其他 符号 的完美解决办法
打开终端,输入: sudo su - > /sys/module/hid_apple/parameters/iso_layout sudo su -需要root权限,所以使用前请注意已下载roo ...
随机推荐
- 配置Sublime Text 3的Python开发环境
最近的项目是用Python开发自动化测试脚本的,所以使用Python比较多.我用的编辑器是Sublime Text3. Sublime Text 3是一个轻量级的跨平台文字编辑器,一经面世便被认为是一 ...
- c++ 构造函数,拷贝构造函数,析构函数与赋值操作符
题目: 为下面的Rectangle类实现构造函数,拷贝构造函数,赋值操作符,析构函数. class Shape { int no; }; class Point { int x; int y; }; ...
- 【手把手教你Elmah】如何在MVC.NET项目中在线查看【错误日志】
一. 在NuGet下载Elmah.MVC dll文件! 或者点击下载dll文件,并且引用客户端. 二.配置WebConfig <sectionGroup name="elmah& ...
- shell 获取cpu使用率
1.shell脚本获取主机每颗CPU使用率的方法. #!/bin/bash interval= cpu_num=`-] -c` start_idle=() start_total=() cpu_rat ...
- Joynet示例:知乎爬虫(搜索关键字相关回答,并下载其中的---图(mei)片(nv))
先贴爬虫程序下载地址:http://pan.baidu.com/s/1c2lxl1e 下载解压后 可直接运行 其中的 run.bat:或者你手动打开命令行执行:Joynet examples\Spid ...
- iOS 网络/本地 图片 按自定义比例缩放 不失真 方法
我尝试了很多种方法,终于,设计了一个方法,能按自己规定的大小压缩 还没失真 如果以后不好用 我再升级 分享给大家: + (CGRect )scaleImage:(UIImage *)image toS ...
- [Arduino] 基于Xbee Pro和网络技术的智能公交系统设计
转自:http://www.21ic.com/app/rf/201112/99474.htm 引言 公共交通具有个体交通无法比拟的强大优势,优先发展城市公共交通系统是解决大.中城市交通问题的最佳途径. ...
- windws 安装jdk
(1) 到官网下载好jdk:http://www.oracle.com/technetwork/java/javase/downloads/jdk8-downloads-2133151.html (2 ...
- sql server小技巧-自动添加时间与主键自增长
在敲机房收费系统的时候,遇到添加时间的时候总是通过vb端调用当前时间再添到sql server中,期间还有时因为添加时间格式的不统一导致一些小问题,现在才知道原来是自己孤陋寡闻,sql server ...
- PHP实现无级递归分类(ThinkPHP框架)
/** * 无级递归分类 * @param int $assortPid 要查询分类的父级id * @param mixed $tag 上下级分类之间的分隔符 * @return string $tr ...