Jquery 覆盖默认定位

Question

我有一个 jquery 工具覆盖了我的 wordpress 博客，并且我有代码可以在调整窗口大小时将其保持在我希望的位置。但是在第一次点击加载覆盖时，它显示在页面的中心，我需要将它设置到左侧额外的 250px。

这是我的定位代码:

$(document).ready(function() { setDef() });

function setDef() {
var w = $('.simple_overlay').width();//get width of overlay
    var h = $('.simple_overlay').height(); //get height of overlay
    var l = ($(window).width() - w) / 2 + 250;  //calculate left property
    var t = ($(window).height() - h) / 2  //calculate top property
$('.simple_overlay').css({ 'left': l })
}

上面应该计算默认位置(居中)然后添加 250px，但它不添加 250。 下面的代码会在调整窗口大小时添加 250。

$(window).resize(function() { rePosition() });

function rePosition() {
    var w = $('.simple_overlay').width();//get width of overlay
    var h = $('.simple_overlay').height(); //get height of overlay
    var l = ($(window).width() - w) / 2 + 250;  //calculate left property
    var t = ($(window).height() - h) / 2  //calculate top property
    $('.simple_overlay').css({ 'left': l })

我想我需要使用 (document).ready 以外的东西

Ps- 您可以通过单击右上角关闭叠加层，目前没有视觉指示器，但您的光标会改变。

有什么建议吗？

谢谢!!!

Answer 1

只需删除 setDef() 函数并调用 rePosition() 到#search-box-nav 图像(或无论哪个元素都有点击处理程序)。

如果您刷新页面并在控制台中运行以下代码，那么它会模仿这样做......

$("#search-box-nav img").bind("click", function() { rePosition(); });