Question

我有以下脚本：

<head>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" type="text/css" href="css/bootstrap.css">
    <!--link rel="stylesheet" type="text/css" href="css/main.css"-->

    <script src="http://code.jquery.com/jquery.min.js"></script>
    <script>
        $(window).resize(function () { 
           $('body').css('padding-top', parseInt($('#navbar').css("height"))+10);
        });

        $(window).load(function() { 
            alert(parseInt($('#navbar').css("height")));
           $('body').css('padding-top', parseInt($('#navbar').css("height"))+10);         
        }); 
    </script>
</head>

基本上我有一个固定的顶部导航栏（<nav id="navbar" class="navbar navbar-inverse navbar-fixed-top">），它覆盖了页面顶部的实际正文内容。我从许多其他来源遇到了这个解决方案（在window.load完成之后，根据导航栏的高度设置主体的填充）。但它不起作用。 window.resize工作得很好，并会相应地重新调整身体的填充。

知道什么是错的吗？当我第一次加载页面时，执行alert语句并说值为NaN。后面的页面仍然是完全白色的，在我点击“确定”之前根本没有加载。这样做就是chrome和Firefox。知道发生了什么事吗？感谢。

编辑：添加更多代码。

这是身体

<body ng-app="cosmoApp">
    <div ng-include="'templates/header.html'"></div>
    <div ng-view></div>
    <div ng-include="'templates/footer.html'"></div>

    <script src="/scripts/angular.js"></script>
    <script src="/scripts/angular-route.js"></script>
    <script src="/scripts/cosmo.js"></script>
    <script src="http://code.jquery.com/jquery.min.js"></script>
    <script src="/scripts/bootstrap.min.js"></script>

</body>

这是Angular推入体内ng-view div的部分html。

<nav id="navbar" class="navbar navbar-inverse navbar-fixed-top">
<div class="container">
    <div>
        <div class" jumbotron navbar-brand">
            <h2>Whatever</h2>
        </div>
        <ul class="nav navbar-nav navbar-right">
            <li><a href="#">Home</a></li>
            <li><a href="#/services">Services</a></li>
            <li><a href="#/gallery">Gallery</a></li>
            <li><a href="#/about">About Us</a></li>
            <li><a href="#/contact">Contact</a></li>
        </ul>
    </div>
</div>
</nav>

这是JS

angular.module('cosmoApp', ['ngRoute'])
.config(['$routeProvider', 
function($routeProvider){
    $routeProvider
    .when("/", {templateUrl: "partials/home.html", controller : 'PageCtrl'})
    .when("/services", {templateUrl: "/partials/services.html", controller : "PageCtrl"})
    .when("/gallery", {templateUrl: "/partials/gallery.html", controller : "PageCtrl"})
    .when("/about", {templateUrl: "/partials/about.html", controller : "PageCtrl"})
    .when("/contact", {templateUrl: "/partials/contact.html", controller : "PageCtrl"})
    .otherwise({redirectto: "/"});
}]).controller("PageCtrl", function($scope)
{

});

编辑2：

添加页面加载的屏幕截图。为什么它认为窗口在这个阶段加载，如果它没有实际加载？

$（window）.load似乎不等待一切都完成

0 个答案: