Pembetulan dari main blog. (millions of sorry!!)
Thursday, 13 December 2012
- Paste these codes before </style> :
#sidebar {
position:absolute;
margin-left:150px;
top:200px;
width:200px;
padding:10px;
background-color:#000000;
}
#image {
width:200px;
opacity:1;
-webkit-transition: all 1.5s ease;
-moz-transition: all 1.5s ease;
-o-transition: all 1.5s ease;
transition: all 1.5s ease-in-out;
}
#image img {
width:200px;
}
#sidebar:hover #image {
opacity:0.5;
}
#c-links {
position:fixed;
text-align:center;
text-transform:uppercase;
font-family:consolas;
font-size:9px;
margin-top:-125px;
margin-left:55px;
opacity:0;
-webkit-transition: all 1.5s ease;
-moz-transition: all 1.5s ease;
-o-transition: all 1.5s ease;
transition: all 1.5s ease-in-out;
}
#c-links a {
color:#797979;
height:10px;
width:80px;
background-color:#eeeeee;
text-align:center;
padding:3px;
padding-top:5px;
display:inline-block;
-webkit-transition: all 1s ease;
-moz-transition: all 1s ease;
-o-transition: all 1s ease;
transition: all 1s ease-in-out;
}
#c-links a:hover {
background-color:#dddddd;
}
#sidebar:hover #c-links {
opacity:1;
}
Paste these codes after <body> :
<div id="sidebar"> <div id="image"><img src="http://data.whicdn.com/images/45748211/tumblr_m822zwy2sZ1r0xteho1_400_large.jpg"> </div> <div id="c-links"> <a href="http://">Link</a></p> <a href="http://">Link</a></p> <a href="http://">Link</a></p> <a href="http://">Link</a></p> </div></div>
Mana-mana code yang diboldkan dalam blockquote boleh diubah. Ya know the width, height, position and colours, oh and the image too. Takkan dok nak sebiji dengan live preview gua. Do the usual drills.
