Hemligheten bakom "Blondinbella"-menyn
För alla er som frågat mig ett antal gånger så tänkte jag skriva lite kort om min vänstermeny som följer med sidan när man rullar ner.
Detta är för de som kan lite om html.
Jag arbetar med lager (layers), även kallat "AP Div"s. Det är inte mkt annat än en liten osynlig ruta som du kan med kod bestäma exakt var den skall vara etc.
Det är väldigt likt layers som i photoshop men man kan med kod bestäma var dem ska ligga någonstans.
Detta är för de som kan lite om html.
Jag arbetar med lager (layers), även kallat "AP Div"s. Det är inte mkt annat än en liten osynlig ruta som du kan med kod bestäma exakt var den skall vara etc.
Det är väldigt likt layers som i photoshop men man kan med kod bestäma var dem ska ligga någonstans.
<div style="position: relative; z-index: 9; left: 0px; top: 0px; padding:16px;border:0px;" >
Hej detta är insidan av en AP Div.
Här kan du lägga bilder etc.
</div>
Här ser ni ett exempel på en ap div som jag valt ska vara 0pixlar ifrån topen av hemsidan och 0 pixlar ifrån vänstersidan.
Position
Relative - Den här inställningen gör att lagret är relativt till övriga hemsidan. Dvs hemsidans kanter
Fixed - Den här inställningen gör att lagret är relativt till SKÄRMENs visning av hemsidan. Det väl säga att den hela tiden är på exakt samma plats även om man rullar ner så är den fortfarande kvar. Gå in här för att se exemplet "Tbks till startsidan".
Z-index - Om du har många lager så kan du ange index, dvs om ett lager har nr 1 och ett nr 2 så kommer tvåan hamna framför nummer 1.
Left
Right
Top
Bottom - Dessa anger hur långt ifrån vänster, höger, toppen, bottnen av sidan som lagret ska finnas. obs du kan/bör inte ange både höger och vänster eller top och botten. Välj höger eller vänster, top eller botten.
Padding - Är avståndet runt om själva lagret där det ska vara tomrum.
Border - Om du vill ha en kant på lagret, vilket du INTE vill för lagret ska va onsynligt för du redan designet en så bra bild i lagret att du inte behöver någon kant.
Mer info så
För att få lagret att med fördröjning följa med hemsidan á la mig är i 2 steg.
Steg Nr 1
Ladda ner javascriptet - Klicka här
Jag ska inte ta credit för javascriptet..
Då jag laddat ner det själv och endast modifierat det lite
Steg Nr 2
Skriv in ditt lager och DIREKT UNDER DETTA kopierar du in koden
Exempel
<div style="position: relative; z-index: 9; left: 0px; top: 0px; padding:16px;border:0px;" >
Detta är mitt lager
</div>
HÄR DIREKT EFTER "</div>" skriver du in javascriptet.
Steg Nr 3
För att få lagret och javascriptet att fungera ihop MÅSTE man ange "id=floatdiv" i lagret
Exempel
<div id="floatdiv" style="position: absolute; z-index: 9; left: 0px; top: 0px; padding:16px;border:0px;" >
Jag tänker INTE svara på en massa individuella frågor, men är det något i inlägget ni inte förstår eller något jag skrivit otydligt/fel så säg till så uppdaterar jag inlägget!!
Kommentarer
Postat av: Emelie
=D Bra att du skrev inlägg om detta:)
Postat av: viccy
ändy, din blogg ser asbra ut! sitsnygg bild på dig, den i vänstra hörnet! ser sjukt fräsch ut:) (det gör du annars också tolka det inte fel:P)
puss
Trackback