Sannas Bloggtips

Liten slidedown

#box-slidedown {
text-align: center;
font-size: 11px;
position:fixed;
left:5px;
top:-311px;
-webkit-transition: all .5s ease-in-out;
-moz-transition: all .5s ease-in-out;
-o-transition: all .5s ease-in-out;
z-index:999;
}

#box-slidedown:hover {
top:0px;
}

#header-slidedown {
border-bottom:1px #b5b5b5 solid;
text-align: center;
font-size: 11px;
position:fixed;
left:10px;
top:-108px;
-webkit-transition: all .5s ease-in-out;
-moz-transition: all .5s ease-in-out;
-o-transition: all .5s ease-in-out;
background-color:#eee;
z-index:999;
}

#header-slidedown:hover {
top:0px;
}

#title-slidedown {
font-size:10px;
text-transform:uppercase;
font-family:calibri;
letter-spacing:1px;
border-width:1px;
border-color:#b5b5b5;
text-align: center;
height:8px;
padding: 5px 0 8px 0;
background:#eee;
width: 70px;
}

#text-slidedown {
font-family:calibri;
font-size:10px;
text-transform:uppercase;
letter-spacing:1px;
border-right-style:dashed;
border-left-style:dashed;
border-width:1px;
border-color:#b5b5b5;
padding: 2px 0 5px 0;
background: #fff;
width:160px;
height:100px;
z-index: 9999;
}

Sanna tipsar:
Att ha ett en ribbon som jag har, eller rundade kanter, eller att den ska vara så bred/lång eller liknande, som ser i princip exakt likadant ut som i tipset behöver du inte ha. Ända sättet för dig att upptäcka och förstå koden är att prova dig fram. Till exempel kan du ha en annan färg på den, du kan ha raka kanter, du kan ha en text istället för en bild, du kan byta typsnitt - du kan göra vad du vill med koden bara du provar dig fram!

Välkomna till min bloggtipssida som återigen har väckts till liv. Här hittar ni tips och tricks för blogg.se.

Liten slidedown

Kommentarer:

Kommentera här: