Box do Facebook e Twitter na lateral do blog, juntos em um único gadget!

Views:
<style> 
img,a{
border:0;

#on{
visibility:visible;

#off{
visibility:hidden;

#facebook_div{
width:196px;
height:340px;
overflow:hidden;
}
#twitter_div{
width:240px;
height:327px;
overflow:hidden;

 
#kakinetwork_div{
width:300px;
height:97px;
overflow:hidden;
}

#facebook_right{
z-index:10005;
border:2px solid #3c95d9;
background-color:#fff;
width:196px;
height:353px;
position:fixed;
right:-200px;

#facebook_right img{
position:absolute;
top:-2px;left:-33px;
border-radius:none; /*imagem face,,,,,,,,,,,,,,,, -33*/
}
#facebook_right iframe{
border:0 solid #3c95d9;
overflow:hidden;
position:static;
height:360px;
left:-2px;
top:-3px;
}
#twitter_right{
z-index:10004;
border:2px solid #6CC5FF;
background-color:#6CC5FF;
width:240px;
height:327px;
position:fixed;
right:-244px/

#twitter_right_img{
position:absolute;
top:-2px;
left:-33px;
border:0;
border-radius:none; /*imagem Twitter,,,,,,,,,,,,,,,,,-33*/
}
#kakinetwork_right img{
position:absolute;
top:-2px;
left:-101px


#facebook_left{
z-index:10005;
border:2px solid #3c95d9;
background-color:#fff;
width:196px;
height:353px;
position:fixed;
left:-200px;

#facebook_left img{
position:absolute;
top:-2px;right:-35px} 
#facebook_left iframe{
border:0 solid #3c95d9;
overflow:hidden;
position:static;
height:360px;
right:-2px;
top:-3px

#twitter_left{
z-index:10004;
border:2px solid #6CC5FF;
background-color:#6CC5FF;
width:246px;
height:353px;
position:fixed;
left:-250px;

#twitter_left_img{
position:absolute;
top:-2px;
right:-23px;
border-radius:none;
border:0
}
#google_plus_left{
z-index:10003;
background-color:#006ec9;
border:2px solid #006ec9;
border-top:2px solid #0056a0;
border-bottom:2px solid #0056a0;
border-left:2px solid #0056a0;
border-right:hidden;
width:261px;
height:303px;
position:fixed;
left:-261px;
}

#kakinetwork_left img{
position:absolute;
top:-2px;right:-101px;

.box-title1{
border:1px solid #ddd;
-webkit-border-radius:6px;
-moz-border-radius:6px;
border-radius:6px;
-webkit-box-shadow:5px 5px 5px #CCC;
-moz-box-shadow:5px 5px 5px #CCC;
box-shadow:5px 5px 5px #CCC;
margin:10px 0;
padding:10px;


#kakinetwork_right,#kakinetwork_left{
z-index:10003;
border:2px solid #303030;
background-color:#fff;
width:300px;
height:97px;
position:fixed;

</style> 

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script> 
 
<script type="text/javascript"> jQuery(document).ready(function () { jQuery("#facebook_right").hover(function () { jQuery(this).stop(true, false).animate({ right: 0 }, 500); }, function () { jQuery("#facebook_right").stop(true, false).animate({ right: -200 }, 500); }); jQuery("#twitter_right").hover(function () { jQuery(this).stop(true, false).animate({ right: 0 }, 500); }, function () { jQuery("#twitter_right").stop(true, false).animate({ right: -244 }, 500); }); jQuery("#google_plus_right").hover(function () { jQuery(this).stop(true, false).animate({ right: 0 }, 500); }, function () { jQuery("#google_plus_right").stop(true, false).animate({ right: -275 }, 500); }); jQuery("#feedburner_right").hover(function () { jQuery(this).stop(true, false).animate({ right: 0 }, 500); }, function () { jQuery("#feedburner_right").stop(true, false).animate({ right: -304 }, 500); }); });
</script> 

<div id="on">
<div id="facebook_right" style="top: 18%;"> <div id="facebook_div"> 
<img src="http://lh3.googleusercontent.com/-I44nDTfSPyo/Ul1vDPqVB4I/AAAAAAAAJaw/5YFaYhEFb70/s101/facebook.png" alt=""/> 
COLE AQUI O CÓDIGO DE SUA FANPAGE
</div>
</div>
</div> 

<div id="on">
<div id="twitter_right" style="top: 35%;">
<div id="twitter_div"> 
<img id="twitter_right_img" src="http://lh4.googleusercontent.com/-x-u5pxf89SE/Ul1vGP32IeI/AAAAAAAAJa4/G0khEdGLpoU/s101/twitter.png"/> 
AQUI O CÓDIGO DO TWITTER
</div>       
</div>
</div>
</div>

Formulário de contato

Nome

E-mail *

Mensagem *