Floating Facebook Like Box for Blogger.

floating-facebook-like-box-for-blogger.markdown

Floating Facebook Like Box for Blogger.

A Pen by LoneEagle on CodePen.

License.

index.html

<!--Floating-Facebook-Like-Box-STARTS-Widget-by-http://loneeagle110.blogspot.com-->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js" type="text/javascript"></script>

<script type="text/javascript">
//<!--
$(document).ready(function() {$(".floatinglikebox").hover(function() {$(this).stop().animate({right: "0"}, "medium");}, function() {$(this).stop().animate({right: "-250"}, "medium");}, 500);});
//-->
</script>
<style type="text/css">
.floatinglikebox{
background: url("https://4.bp.blogspot.com/-r3cGfmXXnsM/WTLotJ07ZRI/AAAAAAAAgas/p7bK5NlgXE8E2hnDwdVij6CFfzu7vJhowCLcB/s1600/floatingfble.png") no-repeat scroll left center transparent !important;
display:block;float:right;
height:220px;padding:0 5px 0 40px;
width:245px;z-index:99999;
position:fixed;right:-250px;
top:10%;}
.floatinglikebox div{border:none;position:relative;display:block;}
.floatinglikebox span{bottom:10px;font:11px tahoma,verdana,arial,sans-serif;
position:absolute;right:6px;text-align:right;z-index:99999;}
.floatinglikebox span a{color:#808080;text-decoration:none;}
.floatinglikebox span a:hover{text-decoration:underline;}
</style><div class="floatinglikebox" style="">
<div>
<iframe src="//www.facebook.com/plugins/likebox.php?
href=http%3A%2F%2Fwww.facebook.com%2Fpages%2Σταλες-στο-Γαλαζιο-112539732132843&amp;
width=251&amp;height=220&amp;colorscheme=light&amp;show_faces=true&amp;
border_color=%23fffff&amp;stream=false&amp;header=false&amp;" scrolling="no" frameborder="0" style="border:none;overflow:hidden;width:251px;height:210px;background:#fff;" allowtransparency="true">
</iframe><span><a href="https://goo.gl/oZxYwB" target="_blank">Get this</a></span>
</div></div>
<!--Floating-Facebook-Like-Box-STOPS-Widget-by-http://loneeagle110.blogspot.com-->