`
wyzxzws
  • 浏览: 392296 次
  • 性别: Icon_minigender_1
  • 来自: dazhou
社区版块
存档分类
最新评论

ie6绝对居中彻底解决

 
阅读更多

代码:

css

.center {
    position: fixed;
    *position: fixed;
    _position: absolute;
    display: block;
    width: 700px;
    min-height: 80px;
    z-index: 998;
    background-color: #fff;
    border: 1px #d7d7d7 solid;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    -webkit-box-shadow: 0 5px 5px #d7d7d7;
    -moz-box-shadow: 0 5px 5px #d7d7d7;
    box-shadow: 0 5px 5px #d7d7d7;
    top: 50%;
    left: 50%;
    _top: expression(eval(document.documentElement.scrollTop+document.documentElement.clientHeight/2-this.offsetHeight/2-(parseInt(this.currentStyle.marginTop,10)||0)-(parseInt(this.currentStyle.marginBottom,10)||0)));
}

 js

   

高级浏览器ie8+,firefox,chrome,opera,safari
center.css({"margin-left": "-350px", "margin-top": (-1 * pos.height() / 2) + "px"});

 

ie6、7
center.css({"margin-left": (-1 * pos.width() / 2) + "px", "margin-top": (-1 * pos.height() / 2) + "px"});

 注:如果center宽度为百分比,照样适用,只是

高级浏览器ie8+,firefox,chrome,opera,safari
center.css({"margin-left": "center百分比宽度/2", "margin-top": (-1 * pos.height() / 2) + "px"});

 

 

分享到:
评论

相关推荐

    垂直居中显示ie7+

    6. **JavaScript解决方案**: - 如果需要在所有浏览器中都实现完美居中,可以使用JavaScript动态计算元素的高度并设置合适的top值。 - 优点:跨浏览器兼容性好,可以实时调整居中位置。 - 缺点:增加页面负担,...

    DIV绝对居中例子

    在本示例中,我们探讨的是如何实现`div`的绝对居中,无论是水平还是垂直方向,即使`div`的高度是不确定的。下面将详细解释这个`DIV绝对居中`的例子。 首先,我们需要明白`div`的默认布局方式。`div`作为一个块级...

    div错位解决IE6IE7IE8样式不兼容问题

    ### div错位解决IE6/IE7/IE8样式不兼容问题 在Web开发中,兼容性一直是开发者面临的重要挑战之一。特别是在早期浏览器版本中,如Internet Explorer 6(IE6)、IE7 和 IE8,由于这些浏览器对于CSS的支持存在较大差异...

    垂直居中ie8+

    6. **JavaScript解决方案** 如果对IE8的支持是必需的,可以考虑使用JavaScript进行动态调整。例如,通过计算元素的高度并将其相对于父元素的中间位置定位。 以上就是实现"垂直居中ie8+"的几种主要方法。在实际项目...

    js弹出层绝对居中(ie,火狐都支持)

    js弹出层绝对居中(ie,火狐都支持)在不同浏览器上显示效果一样

    DIV+CSS上下左右绝对居中

    在网页设计中,"DIV+CSS上下左右绝对居中"是一个常见的布局需求,尤其是在构建响应式网站时。这个主题涉及到CSS(层叠样式表)的布局技巧,它可以帮助元素在不同屏幕尺寸下都能保持在容器的中心位置。下面将详细探讨...

    垂直居中布局 Vertical-aligned 应用测试:兼容IE6/8/FF

    总结来说,"垂直居中布局 Vertical-aligned 应用测试:兼容IE6/8/FF"这个主题涵盖了解决老版本浏览器的垂直居中问题的各种策略和技术,包括表格布局、定位、CSS Hack以及JavaScript辅助。理解和掌握这些技巧对于确保...

    chrome居中但ie不居中的解决方法

    标题“chrome居中但ie不居中的解决方法”和描述提到了一个具体问题,即在Chrome浏览器中元素能正常居中,但在IE中却无法居中。这个问题主要涉及到CSS样式和XHTML文档类型的声明。 首先,让我们来看看如何使用CSS使...

    css 半透明全屏蒙层 全屏屏蔽 内容绝对居中

    在网页设计中,创建一个半透明的全屏蒙层并实现内容绝对居中是一项常见的需求。这主要用于在页面上提供一种交互式的体验,比如显示加载动画、弹出对话框或者遮罩其他元素。下面我们将详细讲解如何使用CSS来实现这个...

    ASP.NET 绝对居中弹出层

    ASP.NET绝对居中弹出层是一种常见的Web应用交互设计,常用于显示重要的信息或进行用户交互,如登录对话框、消息提示或表单提交。在ASP.NET框架中,结合JavaScript和CSS,我们可以创建一个高性能、高用户体验的弹出...

    javascript IE窗口居中

    标题“javascript IE窗口居中”涉及的是在Internet Explorer(IE)浏览器中,使用JavaScript实现弹出窗口自动居中的技术。JavaScript是一种广泛应用于网页和网络应用的脚本语言,它允许开发者在用户与网页交互时动态...

    JQUERY图片自动垂直居中水平居中-支持IE678910/chrome/firefox/opera

    明锋工作室整理常用资料。本次资料是一个自动居中插件,只要设定div长度和高度,其中的图片会自动铺满容器并且自动居中。...并且该自动居中插件支持IE6、IE7、IE8、IE9、IE10、CHROME、FIREFOX、OPERA。

    IE6 div最小高度去除方法以及IE6div垂直居中css样式

    本篇文章将探讨两个在IE6中常见的问题及其解决方案:去除div最小高度限制和实现div垂直居中。 首先,让我们解决IE6中的div最小高度问题。在IE6中,当尝试设置一个较小的高度(如3px)时,div的实际高度可能不会按照...

    div+css布局限制图片最大宽度图片水平垂直居中兼容IE6

    在本主题中,我们将深入探讨如何通过CSS实现图片的最大宽度限制、水平垂直居中,并确保这种布局在Internet Explorer 6(简称IE6)这样的老版本浏览器中也能正常工作。 首先,我们需要理解CSS中的`max-width`属性。...

    解决IE6、IE7、IE8样式不兼容问题

    ### 解决IE6、IE7、IE8样式不兼容问题:深入探讨与实践 #### 一、引言 在Web开发领域,确保网页在不同浏览器中的兼容性一直是一大挑战,尤其是在面对老旧的IE浏览器(IE6、IE7、IE8)时。这些浏览器由于其过时的...

    jquery实现让弹出层绝对居中

    本文将详细介绍如何使用jQuery实现弹出层的绝对居中。 首先,我们需要理解页面布局的基本概念。在HTML和CSS中,定位(positioning)是决定元素在页面上位置的关键。常见的定位方式有静态定位(static)、相对定位...

    绝对居中div

    在网页设计中,"绝对居中div层"是一种常见的布局技术,用于使一个div元素在容器内保持垂直和水平居中的状态。这种技术对于创建响应式设计、弹出框、对话框或者任何需要在页面中心展示的内容至关重要。下面将详细阐述...

    css解决IE6,IE7,firefox兼容性问题.

    ### CSS解决IE6、IE7及Firefox兼容性问题详解 #### 一、引言 随着互联网技术的发展,浏览器种类日益增多,其中Internet Explorer (IE) 和 Firefox 是早期非常流行的两款浏览器。尤其在2000年代中期,IE6、IE7 和 ...

    ie下margin不居中的三种解决方法

    为了解决IE下margin不居中的问题,文章提供了三种方法: 1. 对网页主体`<body>`声明文本居中 在HTML文档中,我们可以通过给`<body>`标签添加`text-align: center;`属性,来让其中的所有内容默认居中。这是因为`text...

Global site tag (gtag.js) - Google Analytics