การแสดงไอที

กระทู้นี้อาจจะเป็นตัวอย่างที่ดีสำหรับวลี "ยายสอนเพื่อดูดไข่" ... สาเหตุนี้เป็นเรื่อง CSS ขั้นพื้นฐานเพียง แต่สำหรับผู้ที่ชอบหลงลืมฉันนี้อาจจะมีความสุขในการปลอมตัว ฉันเคยคิดว่า (ฉันจะหลวมงานของฉันสำหรับคำพูดนี้) มันเป็นเพียงที่เป็นไปได้ที่จะเก็บบางส่วนของเนื้อหาของหน้า HTML แบบคงที่ (ความหมายของมันยังคงอยู่ในตำแหน่งตามที่เป็นเมื่อเลื่อนหน้าต่าง), สมาร์ทโดยใช้สคริปต์บาง, การทำทุกทางวิทยาศาสตร์เหล่านั้น การคำนวณเพื่อหาตำแหน่งแบบไดนามิกดักเหตุการณ์ Window.scroll และการตั้งค่า timeouts ฯลฯ

ไม่เคยคิดว่ามันอาจเป็นง่ายๆเป็นแบบนี้ .... ที่นี่ใน CSS / HTML ด้านล่างฉันมีสี่บล็อกคงที่หนึ่งคง extrimities แต่ละหน้าบนขวาล่างและซ้าย ... จำเป็นที่จะพูด ... คุณสามารถเลือกคนใดคนหนึ่งหรือมากกว่าถ้าจำเป็นต้องเป็น ...

CSS
คง {display: block; ดัชนี z: 10.; color: # FFFFFF; ล้น-X: ซ่อน; ล้น-y: ซ่อน; ตำแหน่ง: ixed;
}
เนื้อหา # {margin: 0px 100px 150px 160px; border: 1px solid # e6e6e6}

# ห่อ-T {ชั้น: 0px; พื้นหลัง: # 33CC66; กว้าง: 100%; ความสูง: 55px;}

# ห่อ-l {ชั้น: 80px; พื้นหลัง: # FF9966; ความสูง: 300px; กว้าง: 150px; border: 2px solid # e6e6e6;}

# ห่อ b-{ด้านล่าง: 0px; พื้นหลัง: # 3333CC; กว้าง: 100%; ความสูง: 55px;}

# ห่อ-r {ชั้น: 80px; พื้นหลัง: # 6666FF; ความสูง: 300px; กว้าง: 140px; border: 2px solid # e6e6e6; ขวา: 0;}

HTML
id="contents"> <div คุณเนื้อหาของหน้าหลัก </ div>
<div id="wrap-b" class="static">
สถิติเนื้อหาที่ด้านล่างหน้า
</ div>
<div id="wrap-t" class="static">
สถิติเนื้อหาบนหน้า
</ div>

<div id="wrap-l" class="static">
สถิติเนื้อหาบนหน้าซ้าย
</ div>
<div id="wrap-r" class="static">
สถิติเนื้อหาบนด้านขวาหน้า
</ div>

ดูตัวอย่างที่นี่ wroking