个人中心
文章发布
退出
作者热门文章
- android - 多次调用 OnPrimaryClipChangedListener
- android - 无法更新 RecyclerView 中的 TextView 字段
- android.database.CursorIndexOutOfBoundsException : Index 0 requested, 光标大小为 0
- android - 使用 AppCompat 时，我们是否需要明确指定其 UI 组件(Spinner、EditText)颜色
26
4
在使用 AJAX 将内容插入上述 DIV 后，我无法将页脚 DIV 移动到页面底部。所以最初当页面加载时，页脚 DIV 位于页面底部，但在 AJAX 将大量内容插入到上面的 DIV 后，页脚只是停留在那里，不会自行更新并移动到底部。
有人知道怎么解决吗？我使用 jQUERY 在页面加载后插入 AJAX 内容。
我已经尝试过使用 position:absolute;底部:0； left:0 在页脚 div 上，但在 AJAX 调用后仍保留在那里。
提前致谢。
<body style="width:100%; height:100%;" onload="displayContent()">
<div id="main" style="width:100%; height:100%;" >
<div id="header" style="width:100%; height:10%;">
<div style="width:100%; height:100%;">
<div style="display:inline; float:left; width:10%; height:100%;">Logo</div>
<div style=" display:inline; float:right; width:90%; height:100%;">Navigation Links</div>
</div>
</div>
<div style="width:100%; height:5%;">
Navigation links go here
</div>
<div id="body" style="width:100%; height:75%;">
<div id="content" style="display:inline; float:left; width:70%; height:100%;">Main content from AJAX call after page onload goes here</div>
<div style="display:inline; float:right; width:30%; height:100%; background:red;">Other stuff here</div>
</div>
<div id="footer" style="width:100%; height:10%;">
FOOTER NEEDS TO UPDATE ITSELF AFTER AJAX CALL
</div>
</div>
</body>
最佳答案
问题出在您为元素设置的百分比高度。您需要为 #body 元素提供自动高度，或者使用溢出属性使其响应内容更改。
我不鼓励使用内联样式
<body style="width:100%; height:100%;" onload="displayContent()">
<div id="main" style="width:100%; height:100%;" >
<div id="header" style="width:100%; height:10%;">
<div style="width:100%; height:100%;">
<div style="display:inline; float:left; width:10%; height:100%;">Logo</div>
<div style=" display:inline; float:right; width:90%; height:100%;">Navigation Links</div>
</div>
</div>
<div style="width:100%; height:5%;">
Navigation links go here
</div>
<div id="body" style="width:100%; height:auto; overflow: hidden;">
<div id="content" style="display:inline; float:left; width:70%; height:100%;">Main content from AJAX call after page onload goes hereMain content from AJAX call after page onload goes hereMain content from AJAX call after page onload goes hereMain content from AJAX call after page onload goes hereMain content from AJAX call after page onload goes hereMain content from AJAX call after page onload goes hereMain content from AJAX call after page onload goes hereMain content from AJAX call after page onload goes hereMain content from AJAX call after page onload goes hereMain content from AJAX call after page onload goes hereMain content from AJAX call after page onload goes hereMain content from AJAX call after page onload goes here</div>
<div style="display:inline; float:right; width:30%; height:100%; background:red;">Other stuff here</div>
</div>
<div id="footer" style="width:100%; height:10%;">
FOOTER NEEDS TO UPDATE ITSELF AFTER AJAX CALL
</div>
</div>
</body>关于jquery - 在 AJAX 内容加载后使页脚 DIV 保持底部，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/28783005/
26
4
0
我是一名优秀的程序员,十分优秀！