jquery - 在浏览器窗口的中心覆盖 DIV

Question

我正在使用 jQuery 动画淡入淡出图像，为此，两张图像位于 DIV 内的一个 DIV 中，使它看起来像是一个淡入另一个图像，并且一个位于另一个之上。它有效，我想做的就是将它移到我页面的中心，但似乎无法使其正常工作。这是 HTML 和 CSS。我尝试修改边距、顶部和左侧定位等，但没有成功。感谢您的任何反馈。

编辑:我想要的是一个 DIV 直接放在另一个之上。它们都充满了相同的图像，除了其中一个周围有我在编辑软件中创建的光晕。当页面加载时，jQuery 触发第一个 div，.fade，淡出，并允许其他 div，.inside，淡入，创建一个动画，使它看起来好像一个图像正在慢慢地变成另一个。这已经自动发生并且运行良好。我只是希望图像直接居中在浏览器窗口的中间，而不是自动放置在左侧。

CSS

    .container
    {
        position:relative;
    }
    .fade
    {
        position: absolute;
        z-index:1;
        top:0;
        left:0;
    }
    .inside
    {
        position: absolute;
        display: none;
        z-index:2;
        top:0;
        left:0;
    }

HTML

    <div class="container">
            <div class="fade">
                <img src="namelarge.png" />
                    <div class="inside">
                        <img src="nameglow.png" />
                    </div>
            </div>
        </div>

编辑:这是我的 jQuery

$(window).load(function () {
setTimeout(function () {
    $('div.fade > div') . fadeIn(3000) // 3 second fade in
}, 2000) // after 2 seconds. })

Answer 1

我假设您正在尝试将 .fade div 置于 .container div 的中心。

从.fade css中取出top和left属性，定义width属性，添加:

margin: 0 auto;

这应该水平居中。