Question

我使用以下脚本将主要内容div置于查看区域的中心，这似乎在页面加载或页面调整大小时工作得很好，但是当刷新页面时，内容div会向左侧移动页面的一侧。

按下刷新后可以看到问题：

http://www.twin-focus-photography.co.uk/

<script>
$(document).ready(function(){
    var positionContent = function () {
        var width = $(window).width(); // the window width
        var height = $(window).height(); // the window height
        var containerwidth = $('.container').outerWidth(); // the container div width
        var containerheight = $('.container').outerHeight(); // the container div height
        $('.container').css({position:'absolute',
        left: ($(window).width() - $('.container').outerWidth())/2,
        top: ($(window).height() - $('.container').outerHeight())/2 }); 
};
//Call this when the window first loads
$(document).ready(positionContent);
//Call this whenever the window resizes.
$(window).bind('resize', positionContent);
});
</script>

编辑＆gt;＆gt;＆gt;＆gt;＆gt;＆gt;＆gt;＆gt;＆gt;＆gt;＆gt;＆gt;

好的，我现在已根据一些建议进行了编辑，现在它看起来像这样：

    <script>
    $(document).ready(function(){
    var positionContent = function () {
    var width = $(window).width(); // the window width
    var height = $(window).height(); // the window height
    var containerwidth = $('.container').outerWidth(); // the container div width
    var containerheight = $('.container').outerHeight(); // the container div height
    $('.container').css({position:'absolute',
    left: ($(window).width() - $('.container').outerWidth())/2,
    top: ($(window).height() - $('.container').outerHeight())/2 }); 
    }
    });
    $(document).ready(function(){
    //Call this when the window first loads
    $(document).ready(positionContent);
    //Call this whenever the window resizes.
    $(window).bind('resize', positionContent);
    });
    </script>

这仍然无法在刷新时工作，如果我调整页面大小......它可以工作，在第一次加载.......它工作，点击f5然后它向左倾斜并停留在那里。

Answer 1

工作正常。由于您在document.ready中编写了代码，因此在完全加载页面后，它会将主要内容集中在一起。如果您希望它在完全加载之前工作，则必须使用CSS。

Answer 2

好的我已经修好了，如果我改变了第一个

$(document).ready(function(){

到

$(window).load(function(){

现在一切都有效，即使是在页面刷新.......为什么我不知道.......有人关心评论吗？。

Jquery div不以页面刷新为中心

2 个答案: