Facebook Pop Out Like Box With Smooth Jquery Hover Effect ITGenius4u

Facebook Pop Out Like Box With Smooth Jquery Hover Effect

Facebook Pop Out Like Box With Smooth Jquery Hover Effect

This widget is Usage By Every Blogger widget, Firstly this Widget was Developed By ( Haris )
I just Re-share this Widget on my Blog..

How Install This Widget On Blogger?

1. Click On Layout On the Left Side Of Your Blogger Dashboard.
2. Click Add a Gadget

1. Click on HTML/JavaScript

1. Copy The Script Given Below And Paste it
2. Do Nothing Just Change Your Facebook Name Instead Of ITGeniu4u in the Blu Color.

<script src="http://code.jquery.com/jquery-1.11.0.min.js"></script><style type="text/css">.mdfbplikebox span{bottom: 12px;font: 8px "lucida grande",tahoma,verdana,arial,sans-serif;position: absolute;right: 6px;text-align: right;z-index: 99999;}.mdfbplikebox span a{color: #808080;text-decoration:none;}.mdfbplikebox span a:hover{text-decoration:underline;}
/*<![CDATA[*/
#fbplikebox{display: block;padding: 0;z-index: 99999;position: fixed;}
.fbplbadge {background-color:#3B5998;display: block;height: 150px;top: 50%;margin-top: -75px;position: absolute;right: -47px;width: 47px;background-image: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjIXDh0pgZNoWrkcdtb1fmvQk3ZuVQMFgIqmg11cmMw9krO7ONkjqI9eypsPXBih1Q0AYDiWIapJame5t3CR_Qc81CaXhTvQ5Pdbpn-MSlgOeFquVByiLNHuLJmetGAPBvcEThYPHWi_lE3/s1600/md_vertical-left.png");background-repeat: no-repeat;overflow: hidden;-webkit-border-top-right-radius: 8px;-webkit-border-bottom-right-radius: 8px;-moz-border-radius-topright: 8px;-moz-border-radius-bottomright: 8px;border-top-right-radius: 8px;border-bottom-right-radius: 8px;}
/*]]>*/
</style>
<script type="text/javascript">
/*<![CDATA[*/
    (function(md){
        md(document).ready(function(){
            var $dur = "medium"; // Duration of Animation
            md("#fbplikebox").css({left: -250, "top" : 100 })
            md("#fbplikebox").hover(function () {
                md(this).stop().animate({
                    left: 0
                }, $dur);
            }, function () {
                md(this).stop().animate({
                    left: -250
                }, $dur);
            });
            md("#fbplikebox").show();
        });
    })(jQuery);
/*]]>*/
</script>
<div class="mdfbplikebox">
<div id="fbplikebox" style="display:none;">
    <div class="fbplbadge"></div> 
    <iframe src="http://www.facebook.com/plugins/likebox.php?href=https://www.facebook.com/ITGenius4u&amp;width=250&amp;height=250&amp;colorscheme=light&amp;show_faces=true&amp;border_color=%23C4C4C4&amp;stream=false&amp;header=false" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:250px; height:250px;background:#F5EBF5;" allowTransparency="true"></iframe><span>
By <a href="http://www.makingdifferent.com/">Making DIfferent</a> / <a href="http://www.makingdifferent.com/add-static-facebook-pop-out-like-box-with-smooth-jquery-hover-effect/">+Get This!</a>
</span>
</div>
</div>