我的wordpress模板使用Facebox通过Ajax请求显示投资组合图像。

问题是图像会根据查看器的屏幕大小而在不同位置加载。

我的模板使用

$('#facebox').css({
    top:    getPageScroll()[1] + (getPageHeight() / 10),
    left:   385.5
  }).show()


facebox网站使用

$('#facebox').css({
   top: getPageScroll()[1] + (getPageHeight() / 10),
   left: $(window).width() / 2 - 205
 }).show()


facebox网站可以完美显示图像,但是当我在模板中使用同一行时,它无法正确显示。

有人可以指出我正确的方向,以使图像一致地加载到屏幕中央吗?

Link to the portfolio site im trying to fix

Link to the facebox site

最佳答案

公式为:(window.width / 2)-(target.width / 2)

$('#facebox').css({
   top: getPageScroll()[1] + (getPageHeight() / 10),
   left: ($(window).width() / 2) - ($('#facebox').outerWidth() / 2)
 }).show()


请注意,尽管您的图像更宽,但是facebox.css会将div#facebox设置为710px宽度。我使用outerWidth()而不是width(),但是不确定这是否能正确说明css 710px的宽度。

10-07 16:48