Javascript 通过偏移数学对中'；不能在非webkit浏览器中工作

守则：

在FF、IE7和IE9（我测试过的唯一不运行WebKit的浏览器）中，似乎left属性要么总是设置为

0

，要么在IE中设置为负值

我的定位代码都基于文档的尺寸

function open_img_in_face_box(id, width){
    max_width = $j(document).width();
    max_height = $j(document).height();
    padding = 150;

    passed_width = width || (max_width - (2 * padding));

    var img = $j('#' + id); 
    dom_img = document.getElementById(id); 

    $j(document).bind('reveal.facebox', function() { 
        $j("#facebox .image img").width(passed_width);
    })
    // display 
    jQuery.facebox({ 
        image: img.attr('src')
    });

    // center and adjust size
    var aspect_ratio = img.width() / img.height();
    var img_width = passed_width;
    var img_height = passed_width / aspect_ratio;

    window_center_y = max_height / 2;
    window_center_x = max_width / 2;

    offset_y = window_center_y - (img_height / 2);
    offset_x = window_center_x - (img_width / 2);

    var fbx = $j('#facebox');
    fbx.css('position', 'absolute');
    fbx.css('left', offset_x + 'px !important');
    fbx.css('top', offset_y + 'px !important');
    fbx.css('margin-left', 'auto');
    fbx.css('margin-right', 'auto');

}

marginleft

和

marginright

在这里似乎没有任何作用，我对此很满意，因为左边的数学应该适用于所有浏览器，对吗？（这只是数学）

---

facebox/lightbox的目标是水平和垂直居中。

为什么您甚至会首先通过编程计算位置？如果用户调整页面的大小怎么办？这可以很容易地在纯CSS中完成

我真的不理解您的JSFIDLE（或者我没有看到相同的东西吗？），所以我只给您这个脚本：它可以根据您的喜好进行修改。是的

---

现在很容易隐藏和显示-隐藏、淡出

.overlay

。为了显示，淡入淡出。要更改内容，请在

.popup

中替换HTML。大量添加关闭框和其他内容。

您尝试过哪些webkit浏览器？@MattBall--FF在OP的列表中为什么不使用css进行定位？这在Chrome中对我来说似乎很好（webkit）。（编辑）它在Safari中工作。。。到底是什么问题？@Pointy：我认为标题编辑有问题，我已经纠正了。Lindyhop或其他，如果我犯了错误，请回滚。我没有做CSS，因为需要居中的div是预定义的。（ala，Facebox）@TheLindyHop:那么。。。不要使用Facebox。它很容易被复制。JSFIDLE更新以反映这一点。嗯。。。我想你不明白人们为什么用facebox。ಠ_ಠ@TheLindyHop：因为它要求你写下自己的定位，我想这是行不通的。。。除非FaceBox已经这么做了？那你为什么要自己写呢？也许我不太明白你的问题，想澄清一下吗？是的，facebox已经做到了。。有点。我试图做的技巧是让facebox相对于文档定位自己，而不是包含div。