Add Transparent dock to your blog
Finally friends.I designed the transparent dock for the blogger. It's a very Stylish gadget for blog's.This gadget remains on the page even user scroll the page.So now add this gadget to your blog. Follow the steps.
If you want to use this gadget you should keep this notice
in the code-->
1) Go to Blogger Dashboard > Design > Page/Edit Layout.
2) Add a Gadget > HTML/JavaScript.
3) Copy the code below and paste it into the window.
<html>
<!--This gadget is created by kiran manchekar.If you want to use this gadget you should keep this notice
in the code-->
<style>
#kilko{position:relative;left:500px;top:-510px;height:100px;width:400px;border-radius:10px;margin:20px;background:transparent;-webkit-box-shadow:0 0 1em hsla(0, 0%, 0%, 1.0);-moz-box-shadow:0 0 1em hsla(0, 0%, 0%, 1.0);box-shadow:0 0 1em hsla(0, 0%, 0%, 1.0);}
#floating_corner_blogger {
position:fixed;_position:absolute;bottom:0px; left:0px;background:transparent;
clip:inherit;
_top:expression(document.documentElement.scrollTop+
document.documentElement.clientHeight-this.clientHeight); _left:expression(document.documentElement.scrollLeft+ document.documentElement.clientWidth - offsetWidth); }
body{height:3000px;width:1400px;background-image:url('file:///C:/Users/Public/Pictures/Sample%20Pictures/Penguins.jpg')}
</style>
<body>
<div id="floating_corner_blogger">
<div id="kilko">
<a href="">
<img src="http://userlogos.org/files/logos/shniggysaurus/fb.png" height="90"width="120"></img>
</a>
<a href="">
<img src="http://72psd.com/wp-content/themes/classic/images/upload/twitter.png" height="90"width="120"></img>
</a>
<a href="">
<img src="http://png-3.findicons.com/files//icons/1066/orb/128/blogger.png" height="90"width="120"></img>
</a>
</div>
</div>
</body>
</html>
4) By chnaging #kilko properties you can change the size and appearance of the aqua dock.
5) Save it and you have done.
If you want any help or like this post please comment.
0 comments: