บทความนี้จะแนะนำคำอธิบายโดยละเอียดของวิธี HTML5 ในการวางส่วนท้ายของหน้า (CSS+JS) และแบ่งปันกับทุกคน โดยมีรายละเอียดดังนี้:
จาวาสคริปต์:
<script type=text/javascript> $(function(){ function footerPosition(){ $(footer).removeClass(fixed-bottom); // ความสูงของข้อความแบบเต็มของเนื้อหาเว็บเพจ var contentHeight = document.body.scrollHeight, // ความสูงของหน้าต่างที่มองเห็นได้ ไม่รวมแถบเครื่องมือด้านบนของเบราว์เซอร์ winHeight = window.innerHeight; if(!(contentHeight > winHeight)){ // เมื่อความสูงของข้อความหน้าเว็บน้อยกว่าความสูงของหน้าต่างภาพ ให้เพิ่มคลาสด้านล่างคงที่ในส่วนท้าย $(footer).addClass(fixed-bottom); } else { $(footer).removeClass (คงที่ด้านล่าง); } } footerPosition (); $(window).resize(footerPosition); });</script>ซีเอสเอส:
.fixed-bottom { ตำแหน่ง: คงที่; ด้านล่าง: 0; ความกว้าง: 100%;}ข้างต้นคือเนื้อหาทั้งหมดของบทความนี้ ฉันหวังว่ามันจะเป็นประโยชน์ต่อการศึกษาของทุกคน ฉันหวังว่าทุกคนจะสนับสนุน VeVb Wulin Network