Question

我正在尝试用bootstrap做bootstrap navbar-fixed-top。我只是使用Document.body进行动态填充。它不起作用。现在有人可能是什么原因？请告诉我。

HTML：

<nav class="navbar navbar-default navbar-fixed-top" id="topnavbar">
    <div class="container">Hedaer
        <br/>
        <br/>
        <br/>
        <br/>
        <br/>
    </div>
</nav>
<article>
    <h3>Contents</h3>
    testtesttesttesttesttesttesttesttesttesttesttes  <br/><br/>
    testtesttesttesttesttesttesttesttesttesttesttes  <br/><br/>
    testtesttesttesttesttesttesttesttesttesttesttes  <br/><br/>
    testtesttesttesttesttesttesttesttesttesttesttes  <br/><br/>
    testtesttesttesttesttesttesttesttesttesttesttes  <br/><br/>
    testtesttesttesttesttesttesttesttesttesttesttes  <br/><br/>
    testtesttesttesttesttesttesttesttesttesttesttes  <br/><br/>
    testtesttesttesttesttesttesttesttesttesttesttes  <br/><br/>
    testtesttesttesttesttesttesttesttesttesttesttes  <br/><br/>testtesttesttesttesttesttesttesttesttesttesttes  <br/><br/>testtesttesttesttesttesttesttesttesttesttesttes  <br/><br/>
    testtesttesttesttesttesttesttesttesttesttesttes  <br/><br/>testtesttesttesttesttesttesttesttesttesttesttes  <br/><br/>
    testtesttesttesttesttesttesttesttesttesttesttes  <br/><br/>
    testtesttesttesttesttesttesttesttesttesttesttes  <br/><br/>
    testtesttesttesttesttesttesttesttesttesttesttes  <br/><br/>
    testtesttesttesttesttesttesttesttesttesttesttes  <br/><br/>
    testtesttesttesttesttesttesttesttesttesttesttes  <br/><br/>
    testtesttesttesttesttesttesttesttesttesttesttes  <br/><br/>
    testtesttesttesttesttesttesttesttesttesttesttes  <br/><br/>
    testtesttesttesttesttesttesttesttesttesttesttes  <br/><br/>
    testtesttesttesttesttesttesttesttesttesttesttes  <br/><br/>
    testtesttesttesttesttesttesttesttesttesttesttes  <br/><br/>
    <br/>
    <br/>
    <br/>
    <br/>
    <br/>
    <br/>
    <br/>
    <br/>
    <br/>
    <br/>
    <br/>
    <br/>
    <br/>
    <br/>
    <br/>
    <br/>
    <br/>
    <br/>
    <br/>
    <br/>
    <br/>
    <br/>
    <br/>
    <br/>
    <br/>
    <br/>
    <br/>
    <br/>
    <br/>
    <br/>
    <br/>
    <br/>
    <br/>
    <br/>
    <br/>
    <br/>
    <br/>
    <br/>
    <br/>
    <br/>
    <br/>
</article>

使用Javascript：

$(function () {
    var article = document.createElement("article");

    $(document.body.appendChild(article)).css('padding-top', $('#topnavbar').height() + 70);

    $(window).resize(function () {
        $(document.body.appendChild(article)).css('padding-top', $('#topnavbar').height() + 70);
    });
});

jsfiddle.net/drg6oe81/2/

Answer 1

不确定您要问的是什么，但是您没有正确地为文章添加填充。你正在使用

 $(document.body.appendChild(article))

这很有效。

$('article')

http://jsfiddle.net/drg6oe81/5/

如果你问如何添加元素，那么你需要输入一个列表。这是一个例子：

http://jsfiddle.net/drg6oe81/8/

Answer 2

使用＆＃39; body＆＃39;将填充应用于身体，例如：

$('body').css('padding-top', $('#topnavbar').height() + 70);

请参阅this updated fiddle

Bootstrap＃navbar-fixed-top使用jquery

2 个答案: