Question

伙计们我编写了一个非常简单的jquery脚本，可以在网页上正确放置元素，基本上可以在没有媒体查询的情况下使其响应。现在它工作得很好，但window.resize没有触发document.ready它适用于窗口调整大小它没有。任何帮助将受到高度赞赏。将链接放在底部的页面

    // JavaScript Document
$(document).ready(PlaceContents);
$(window).ready(PlaceContents);
$(window).on('resize',PlaceContents);

function PlaceContents() {                

        var Wheight = $(document).height();
        var Wwidth = $(document).width();
        var contentPos = Wwidth/4;
        var contentH = Wheight/5;


        //adjust menubar height
        $('#menubar').height(Wheight);

        //center main content
        $("#maincontent").css({top: contentH, left: contentPos, position:'absolute'});


};

http://www.mobileapplicationlabs.com/goldentreehotels/

Answer 1

希望这就是你要找的东西。

window.addEventListener('resize', function() {
    PlaceContents();
}, false);

Answer 2

你应该对此进行回调：

＆＃13;

 $(document).ready(function(){
	 PlaceContents();
 });


 function PlaceContents() {                
         var Wheight = $(document).height();
         var Wwidth = $(document).width();
         var contentPos = Wwidth/4;
         var contentH = Wheight/5;


         //adjust menubar height
         $('#menubar').height(Wheight);

         //center main content
         $("#maincontent").css({top: contentH, left: contentPos, position:'absolute'});


 };

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form id="maincontent"  method="POST">
       <input type="submit" value="menubar" name="menubar" id="menubar">
</form>

＆＃13;

Answer 3

您可以使用以下功能

$(window).bind("load resize", function () {
    PlaceContents();
});

希望这会对你有所帮助。

Answer 4

你可以这样编写相同的代码：

调整大小功能将在页面加载后运行，也会在调整大小事件时运行。

祝你好运：）

$(document).ready(function(){   
    $(window).resize(function(){    
        var Wheight = $(window).height();
        var Wwidth = $(window).width();
        var contentPos = Wwidth/4;
        var contentH = Wheight/5;
        //adjust menubar height
        $('#menubar').height(Wheight);
        //center main content
        $("#maincontent").css({top: contentH, left: contentPos, position:'absolute'});      
    }).resize();
});

Answer 5

试试这段代码：

$(document).ready(function(){   
    $(window).resize(function(){    
        var Wheight = $(window).height();
        var Wwidth = $(window).width();
        var contentPos = Wwidth/4;
        var contentH = Wheight/5;
        //adjust menubar height
        $('#menubar').height(Wheight);
        //center main content
  $("#maincontent").css({top: contentH, left: contentPos, position:'absolute'});      
    });
});

jquery window.resize无效

5 个答案: