Blocks fikse (Kjo mbetet statike në dritare scroll) Page përdorur CSS Vetëm

Ky post mund të jetë një shembull i mirë për shprehja "Mësimi gjyshe të thith vezë" ... Sepse kjo është vetëm THEMELORE Stuff CSS. Por për ata, si mua pavëmendshëm, kjo mund të jetë një bekim në maskim. Unë gjithmonë kam menduar (unë mund të humb punën time për të thënë këtë), ishte e mundur vetëm për të mbajtur disa pjesë të përmbajtjes së faqes HTML statik (kuptimi, pozicioni i saj mbetet AS IS në libër Window), duke përdorur disa Scripts zgjuar, të bësh të gjitha ato shkencore llogaritjet për të gjetur pozicionin e dinamik, zënë ngjarjet Window.scroll dhe vendosjen e mbarime etj

Asnjëherë mos menduar se mund të thjeshtë si kjo .... Këtu në CSS / HTML më poshtë, unë kam katër blloqe statike, e fiksuar për çdo extrimities e faqe, TOP, DREJTA, BOTTOM dhe LEFT ... panevojshme të thuhet ... ju mund të zgjidhni çdo një ose më shumë në qoftë se duhet të jetë ...

CSS
. Statike {display: block; z-index: 10; color: # ffffff; del nga shtrati-x: fsheur, del nga shtrati-y: fsheur; Pozita: ixed;
}
Përmbajtja msgstr {margin: 100px 150px 0PX 160px; kufirit: 1px solid # e6e6e6}

# Përfundojë-t {top: 0PX; background: # 33CC66; width: 100%; height: 55px;}

# Përfundojë-l {top: 80px; background: # FF9966; height: 300px; width: 150px; kufitare: 2px solid # e6e6e6;}

# Përfundojë-b {bottom: 0PX; background: # 3333CC; width: 100%; height: 55px;}

# Përfundojë-r {top: 80px; background: # 6666FF; height: 300px; width: 140px; kufitare: 2px solid # e6e6e6; drejtë: 0;}

HTML
id="contents"> <div Ju Përmbajtja kryesore page </ div>
<div id="wrap-b" class="static">
Static Content në fund Page
</ Div>
<div id="wrap-t" class="static">
Static Content mbi Faqja Kryesore
</ Div>

<div id="wrap-l" class="static">
Static Content mbi faqe la
</ Div>
<div id="wrap-r" class="static">
Static Content mbi të drejtën Page
</ Div>

Shiko një mostër wroking këtu


Lini një Përgjigju

NDK shtëpi | Duke shprehur IT | qiellëz shprehur | Penmenship shprehur | frikë shprehur | shprehur Myself