Monday, 2 September 2013
SHARING FACEBOOK WIDGET WITH FLOATING EFFECT 2
---------------------------------------------------------------------------------------------
1- GO TO BLOG LAYOUT
2-ADD HTML /JAVA WIDGET
3- PASTE BELOW CODE IN THIS WIDGET
4-CHANGE FACE BOOK PAGE LINK IN IFARME CODE
-----------------------------------------------------------------------------------------------------
GET CODE:
<style type='text/css'>
#FBGadgetsBlogFBpop {
position:fixed !important;
position:absolute;
top:-1000px;
left:50%;
margin:0px 0px 0px -182px;
width:300px;
height:auto;
padding:16px;
background:#FEFEFE;font:normal Dosis, Georgia, Serif;
color:#111;
border:5px solid #123D60;
-webkit-box-shadow:0px 1px 2px rgba(0,0,0,0.4);
-moz-box-shadow:0px 1px 2px rgba(0,0,0,0.4);
box-shadow:0px 1px 2px rgba(0,0,0,0.4);
-webkit-border-radius:10px;
-moz-border-radius:10px;
border-radius:10px;
}
#FBGadgetsBlogFBpop a.FBGadgetsBlogclose {
position:absolute;
top:5px;
right:5px;
display:block;
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhMC2-ZipDvo16APtX1bnhBLgdFNQy3-ev5gqks2XMB_tPaI5G5R9ybhnitBPiVzikXjpI867hK866KtiEEElOsCZ-IAssU-fx_taDno64l0co_lYdjE3zENsoXTPmx-AuDBqay86MCXQTF/s1600/CROSS.png) no-repeat top center;
width:38px;
height:19px;
text-indent:-9999px;
}
</style>
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js' type='text/javascript'></script>
<script type='text/javascript'>
$(window).bind("load", function() {
// Animate Top
$('#FBGadgetsBlogFBpop').animate({top:"50px"}, 1000);
// Widget by http://fbgadgets.blogspot.co.uk
$('a.FBGadgetsBlogclose').click(function() {
$(this).parent().fadeOut();
return false;
});
});
</script>
<div id='FBGadgetsBlogFBpop'>
<!-- Widget by http://fbgadgets.blogspot.co.uk/ Start -->
<center>
<b>Don't Forget To Join US Our Community</b></center>
<center>
<iframe src="//www.facebook.com/plugins/likebox.php?href=https://www.facebook.com/style4urban&width=292&height=258&colorscheme=light&show_faces=true&border_color&stream=false&header=false&" style="border:none; overflow:hidden; width:292px; height:258px;" >
</iframe></center>
<!-- Widget by http://fbgadgets.blogspot.co.uk/ End -->
<a class='FBGadgetsBlogclose' href='#'>×</a>
<center style='float:right; margin-right:10px;'>
<span style='font-size:xx-small; color:#000; text-decoration:none;'>+Get this at</span>
<a href='http://fbgadgets.blogspot.co.uk/' style='font-size:xx-small; color:#3B78CD; text-decoration:none;' target='_blank'>Widget</a></center>
</div>
#FBGadgetsBlogFBpop {
position:fixed !important;
position:absolute;
top:-1000px;
left:50%;
margin:0px 0px 0px -182px;
width:300px;
height:auto;
padding:16px;
background:#FEFEFE;font:normal Dosis, Georgia, Serif;
color:#111;
border:5px solid #123D60;
-webkit-box-shadow:0px 1px 2px rgba(0,0,0,0.4);
-moz-box-shadow:0px 1px 2px rgba(0,0,0,0.4);
box-shadow:0px 1px 2px rgba(0,0,0,0.4);
-webkit-border-radius:10px;
-moz-border-radius:10px;
border-radius:10px;
}
#FBGadgetsBlogFBpop a.FBGadgetsBlogclose {
position:absolute;
top:5px;
right:5px;
display:block;
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhMC2-ZipDvo16APtX1bnhBLgdFNQy3-ev5gqks2XMB_tPaI5G5R9ybhnitBPiVzikXjpI867hK866KtiEEElOsCZ-IAssU-fx_taDno64l0co_lYdjE3zENsoXTPmx-AuDBqay86MCXQTF/s1600/CROSS.png) no-repeat top center;
width:38px;
height:19px;
text-indent:-9999px;
}
</style>
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js' type='text/javascript'></script>
<script type='text/javascript'>
$(window).bind("load", function() {
// Animate Top
$('#FBGadgetsBlogFBpop').animate({top:"50px"}, 1000);
// Widget by http://fbgadgets.blogspot.co.uk
$('a.FBGadgetsBlogclose').click(function() {
$(this).parent().fadeOut();
return false;
});
});
</script>
<div id='FBGadgetsBlogFBpop'>
<!-- Widget by http://fbgadgets.blogspot.co.uk/ Start -->
<center>
<b>Don't Forget To Join US Our Community</b></center>
<center>
<iframe src="//www.facebook.com/plugins/likebox.php?href=https://www.facebook.com/style4urban&width=292&height=258&colorscheme=light&show_faces=true&border_color&stream=false&header=false&" style="border:none; overflow:hidden; width:292px; height:258px;" >
</iframe></center>
<!-- Widget by http://fbgadgets.blogspot.co.uk/ End -->
<a class='FBGadgetsBlogclose' href='#'>×</a>
<center style='float:right; margin-right:10px;'>
<span style='font-size:xx-small; color:#000; text-decoration:none;'>+Get this at</span>
<a href='http://fbgadgets.blogspot.co.uk/' style='font-size:xx-small; color:#3B78CD; text-decoration:none;' target='_blank'>Widget</a></center>
</div>
Related movie you might like to see :
GOOGLE CUSTOM SEARCH BOX
RELATED POST WIDGET LIST WITHOUT TH...
FLASH PLAYER SWF FILE DOWNLOAD ARCH...
WHACK A RAT CSS GAME
CSS SLIDER WITHOUT JS
FLICKITY SLIDER SCROLL WITH RADIO N...
FLICKITY JS CSS SLIDER
RADIO BUTTON SLIDER TO KEY FRAME SL...
BODY JS FILE LINK IN MAGENTO
CSS SYNTAX HIGHLIGHT CHANGE IN NOT...
Related Post for SHARING FACEBOOK WIDGET WITH FLOATING EFFECT 2
Magento Hello World Module (Extension)
FLASH PLAYER SWF FILE DOWNLOAD ARCHIVES
IMAGE UPLOAD WITH JAVA WITHOUT PHP CODE
IMAGE UPLOAD WITH JAVA WITH PHP CODE
BOOTSNIPP LOGIN SIGNUP FORM
WHACK A RAT CSS GAME
FLICKITY SLIDER SCROLL WITH RADIO NEXT PREV BUTTON
ARROW BUTTON
FIREBUG LITE USE OFFLINE
GOOGLE CUSTOM SEARCH BOX 
FLICKITY JS CSS SLIDER
RELATED POST WIDGET LIST WITHOUT THUMBNAIL
FLASH 8 DOWNLOAD
Search Engine Optimization Toolkit UN USED CSS IN GOOGLE
JS IMAGE SCROLLER
HTML CSS GREEN COMMENTS NOTEPAD++
Subscribe to:
Post Comments (Atom)
0 comments:
Post a Comment
Click to see the code!
To insert emoticon you must added at least one space before the code.