Question

这是一个相当随机的问题。我使用CSS3Pie来处理IE中的CSS3兼容性，但我遇到了麻烦。在许多情况下，你需要使用位置：相对于它在IE中正常工作。

当我在包含包装器时使用它时会出现这个问题，因为它会在布局中的零引用中移动。我们用于在我们网站上进行映射的软件使用浏览器左上角的绝对位置作为计算定位的参考点。理想情况下，我们的软件会更灵活，不依赖于这样的绝对位置，但这可能不会很快改变。

所以回答我的问题，是否有可能以某种方式从布局的流程中取出一个元素，并在包含在相对定位的对象中时返回原始的0,0左上角位置？我想也许z-index可能会起作用，但它不能使元素引用回绝对0,0。

最简单的解决方法是不将PIE应用于我的包装器，但是这也会从我的布局包装器中删除圆角和阴影。这不是世界末日，但理想情况下，我想提出一个解决方案。

Answer 1

我认为JS / jQuery是必需的：

尝试类似：

var el = $('#element');

$('body').append(el);
el.remove();

希望这是一个可以接受的解决方案，

W上。

Answer 2

很好的问题：我认为没有js可能是不可能的。

这是一个jQuery解决方法：http://jsfiddle.net/SebastianPataneMasuelli/hSh25/

它取相对定位元素的左侧和顶部值，并从绝对元素中减去它们，实际上将绝对值从原点恢复到原点。

所以，给定

<div id="relative">
relative
  <div id="absolute">
     absolute;
 </div>

计算如何在为定位div添加左值和最高值之前返回0。

var relativeLeft = $('#relative').css('left');
var absoluteLeft =  $('#absolute').css('left');
var returnToOriginLeft = (parseInt(absoluteLeft) - parseInt(relativeLeft)) + 'px';
var relativeTop = $('#relative').css('top');
var absoluteTop =  $('#absolute').css('top');
var returnToOriginTop = (parseInt(absoluteTop) - parseInt(relativeTop)) + 'px';
$('#absolute').css('left', returnToOriginLeft);
$('#absolute').css('top', returnToOriginTop);

你必须在你的实际网站中得到更具体的信息（我想在那里有一堆相对定位的div）。请让我知道它是否是一个可行的CSS3PIE解决方案，因为我打算在项目中自己使用它很快。

注意： Javascript不是我的强项，我怀疑有一种更优雅的方式来编写上述声明。

Answer 3

$(document).ready(function() {
    var el = $('#absolute'); // element we want to work with
    el.clone().appendTo('body'); // clone and append to body
    el.remove(); // remove element
});

这是对 Wilson Page 代码的一点改进。到目前为止仅在localhost上进行了测试，但它确实做到了。已启用IE6 / 7/8 + CSS3PIE测试。

想要把它放在公共网络服务器上，但事实证明他们没有启用*.htc支持，并且当它与PIE.php（PIE提供的脚本）一起使用时 - 它没有工作

稍后当我回到办公室并开始推动系统管理员在服务器上启用*.htc支持时，我会做更多测试。和合

而且，我完全测试了 Sebastian Patane Masue 的剧本，它完成了这项工作！ +1 @ Sebastian 。

P.S。完全我的意思是启用CSS3PIE并将属性添加到实际样式。

编辑：再试一次，结果非常烦人。它可以完美地在localhost上运行，但在远程查看它时会受到严重影响。不知道是什么造成了......

您可以重置CSS元素以引用相对元素中的绝对零

3 个答案: