Friday, 6 September 2013

FLOAT SHARING BUTTON SOSMED

FB Gadgets


FB Gadgets

FB Gadgets

FB Gadgets

FB Gadgets

FB Gadgets

FB Gadgets

FB Gadgets


---------------------------------------------------------------------------------------------
1- GO TO BLOG LAYOUT
2-ADD HTML /JAVA WIDGET
3- PASTE BELOW CODE IN THIS WIDGET
4-CHANGE PAGE LINKS
-----------------------------------------------------------------------------------------------------

FB Gadgets



------------------------------------------------------------------------------------------------------
COPY AND PASTE BELOW CODE IN HTML JAVA WIDGET
-------------------------------------------------------------------------------------------------------

<style>
.FaceBook{
background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhLrOzCN9oBS2szm972ULgpVhpuSLNZQkpcQXyJ3AYwFMqFMTOu7mmEYLygzxMCPHOczqBONihe_S4VF8yI3K5XuGaxBYttNi91NbbqpuLAtIfjYgiyq_UaYVI3eeww2TDkOxm-uqOlM4fb/s1600/FaceBook.png');
background-repeat:no-repeat;
width:43px;
height:43px;
position:fixed;
right:0px;
top:160px;
z-index:1000;
}
.FaceBook:hover{
background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjX6aPBSfE7b7Kbni1uXIparVVScH_yd8oUounuo90tFEOSOlFiZeKcI-N3YjHZKZOcnrSBULiTRGVEhJPdC9OWKOpdrdZKvKicv28fForC3DZmbqyy1613Lh5axaMMWIAJfTK-l_08shRZ/s1600/FaceBookOpen.png');
background-repeat:no-repeat;
width:150px;
height:43px;
position:fixed;
right:0px;
top:160px;
z-index:1100;
}
.Twitter{
background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi2FJ46wQJN8czAYKS_YVusGgyMuxhT0pgR38_1sWd1mkwvVJ1NE2XPuTLwYDLKmvOuqvxEmxOGophv2NY1Ywbsq4MmkTs-i4tUcIZHZvJ5iRuB1u1G-mJpBVuMx-0IUHcLf2_GxmLtdqp6/s1600/Twitter.png');
background-repeat:no-repeat;
width:43px;
height:43px;
position:fixed;
right:0px;
top:205px;
z-index:1000;
}
.Twitter:hover{
background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiz49qJKHSB8LnNW5mlOnvM8FYAqJTzlJUIJd0PNYDIw6UEMXmKC6-7Av7CxS6IdWgqnLtBkdnut45ZJ_NBImFiggtmvjTIKp0r5NS1y36mvBoKCcHFz820PEV9AarWMQKdk_fjcBoz1PUl/s1600/TwitterOpen.png');
background-repeat:no-repeat;
width:150px;
height:43px;
position:fixed;
right:0px;
top:205px;
z-index:1100;
}
.Google{
background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjWt6BxMUwbkpMPd6HuPHdasATw_pJzXQd_YpGDlvPtEMrDi2-1lrs4g-S2VvJuiG8Aj5iUJvlaTc3qUyaPMslVBIdyyjMl6llzeFKTcNdRf6HOqUAaNDoe4fftPHnKgGuuOpRRZ6t8FURK/s1600/Google.png');
background-repeat:no-repeat;
width:43px;
height:43px;
position:fixed;
right:0px;
top:250px;
z-index:1000;
}
.Google:hover{
background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh0fflacpnZp7aXkioKA4V9wlxlOjFxBpcLlaC8VrefHySAwIViAaZPdu1lmZQsJbTfBtaRORRBlFb1eJIMhbCNA1N-WQw2d7tOoWP5qCmdMnkLUMYCOCfOPJ3fADIyHfzt8yUhCamVCFJf/s1600/GoogleOpen.png');
background-repeat:no-repeat;
width:150px;
height:43px;
position:fixed;
right:0px;
top:250px;
z-index:1100;
}
.FeedBurner{
background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjzCOkTFXgTy8sr5zweySvLTe3Ny_Bj4v0XAV0ozYbQpQFT06f6TY8d7-Gmt5nwnv0RTZggFk5fFuy4MQUZ9G1RmRfAv5eQ25qlZGqPJD-E8u3KLJZHSWbgoOlg0rq5WNG5EIBEkVN29O6R/s1600/Rss.jpg');
background-repeat:no-repeat;
width:43px;
height:43px;
position:fixed;
right:0px;
top:295px;
z-index:1000;
}
.FeedBurner:hover{
background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiVb6HTWgMA9kQson3Eq4gGH6uagJSLs9wADpqpdpYmNNs3thvZfJVct-BFYOkE3uQqd_ptN1K6lfkS1VKO_F8LUaFSMq2M9Sa5IRKS9CzPdGtjNXAGFCUTmkbfXCubY4D_j_PLMUqkxbyo/s1600/RssOpen.png');
background-repeat:no-repeat;
width:150px;
height:43px;
position:fixed;
right:0px;
top:295px;
z-index:1100;
}
</style> 

<div class='FaceBook'>
<a href='https://www.facebook.com/style4urban' target='_blank'>
<div class='FaceBook'></div>
</a>
</div>   
<div class='Twitter'>
<a href='https://twitter.com/Style4Urban' target='_blank'>
<div class='Twitter'></div>
</a>
</div>
<div class='Google'>
<a href='https://plus.google.com/u/0/115131756957365821290/posts' target='_blank'>
<div class='Google'></div>
</a>
</div>
<div class='FeedBurner'>
<a href='http://feeds.feedburner.com/FBGadgets' target='_blank'>
<div class='FeedBurner'></div>
</a>
</div>  


----------------------------------------------------------------------------------------------------------
ADD TRANSITION EFFECT  CHANGE UPPER STYLE CODE
------------------------------------------------------------------------------------------------------------

<style>
.FaceBook{
background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhLrOzCN9oBS2szm972ULgpVhpuSLNZQkpcQXyJ3AYwFMqFMTOu7mmEYLygzxMCPHOczqBONihe_S4VF8yI3K5XuGaxBYttNi91NbbqpuLAtIfjYgiyq_UaYVI3eeww2TDkOxm-uqOlM4fb/s1600/FaceBook.png');
background-repeat:no-repeat;
width:43px;
height:43px;
position:fixed;
right:0px;
top:160px;
z-index:1000;
-webkit-transition: all 1s ease;
-moz-transition: all 1s ease;
-o-transition: all 1s ease;
-ms-transition: all 1s ease;
transition: all 1s ease;
}
.FaceBook:hover{
background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjX6aPBSfE7b7Kbni1uXIparVVScH_yd8oUounuo90tFEOSOlFiZeKcI-N3YjHZKZOcnrSBULiTRGVEhJPdC9OWKOpdrdZKvKicv28fForC3DZmbqyy1613Lh5axaMMWIAJfTK-l_08shRZ/s1600/FaceBookOpen.png');
background-repeat:no-repeat;
width:150px;
height:43px;
position:fixed;
right:0px;
top:160px;
z-index:1100;
-webkit-transition: all 0.5s ease;
-moz-transition: all 0.5s ease;
-o-transition: all 0.5s ease;
-ms-transition: all 0.5s ease;
transition: all 0.5s ease
}
.Twitter{
background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi2FJ46wQJN8czAYKS_YVusGgyMuxhT0pgR38_1sWd1mkwvVJ1NE2XPuTLwYDLKmvOuqvxEmxOGophv2NY1Ywbsq4MmkTs-i4tUcIZHZvJ5iRuB1u1G-mJpBVuMx-0IUHcLf2_GxmLtdqp6/s1600/Twitter.png');
background-repeat:no-repeat;
width:43px;
height:43px;
position:fixed;
right:0px;
top:205px;
z-index:1000;
-webkit-transition: all 1s ease;
-moz-transition: all 1s ease;
-o-transition: all 1s ease;
-ms-transition: all 1s ease;
transition: all 1s ease;
}
.Twitter:hover{
background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiz49qJKHSB8LnNW5mlOnvM8FYAqJTzlJUIJd0PNYDIw6UEMXmKC6-7Av7CxS6IdWgqnLtBkdnut45ZJ_NBImFiggtmvjTIKp0r5NS1y36mvBoKCcHFz820PEV9AarWMQKdk_fjcBoz1PUl/s1600/TwitterOpen.png');
background-repeat:no-repeat;
width:150px;
height:43px;
position:fixed;
right:0px;
top:205px;
z-index:1100;
-webkit-transition: all 0.5s ease;
-moz-transition: all 0.5s ease;
-o-transition: all 0.5s ease;
-ms-transition: all 0.5s ease;
transition: all 0.5s ease
}
.Google{
background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjWt6BxMUwbkpMPd6HuPHdasATw_pJzXQd_YpGDlvPtEMrDi2-1lrs4g-S2VvJuiG8Aj5iUJvlaTc3qUyaPMslVBIdyyjMl6llzeFKTcNdRf6HOqUAaNDoe4fftPHnKgGuuOpRRZ6t8FURK/s1600/Google.png');
background-repeat:no-repeat;
width:43px;
height:43px;
position:fixed;
right:0px;
top:250px;
z-index:1000;
-webkit-transition: all 1s ease;
-moz-transition: all 1s ease;
-o-transition: all 1s ease;
-ms-transition: all 1s ease;
transition: all 1s ease;
}
.Google:hover{
background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh0fflacpnZp7aXkioKA4V9wlxlOjFxBpcLlaC8VrefHySAwIViAaZPdu1lmZQsJbTfBtaRORRBlFb1eJIMhbCNA1N-WQw2d7tOoWP5qCmdMnkLUMYCOCfOPJ3fADIyHfzt8yUhCamVCFJf/s1600/GoogleOpen.png');
background-repeat:no-repeat;
width:150px;
height:43px;
position:fixed;
right:0px;
top:250px;
z-index:1100;
-webkit-transition: all 0.5s ease;
-moz-transition: all 0.5s ease;
-o-transition: all 0.5s ease;
-ms-transition: all 0.5s ease;
transition: all 0.5s ease
}
.FeedBurner{
background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjzCOkTFXgTy8sr5zweySvLTe3Ny_Bj4v0XAV0ozYbQpQFT06f6TY8d7-Gmt5nwnv0RTZggFk5fFuy4MQUZ9G1RmRfAv5eQ25qlZGqPJD-E8u3KLJZHSWbgoOlg0rq5WNG5EIBEkVN29O6R/s1600/Rss.jpg');
background-repeat:no-repeat;
width:43px;
height:43px;
position:fixed;
right:0px;
top:295px;
z-index:1000;
-webkit-transition: all 1s ease;
-moz-transition: all 1s ease;
-o-transition: all 1s ease;
-ms-transition: all 1s ease;
transition: all 1s ease;
}
.FeedBurner:hover{
background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiVb6HTWgMA9kQson3Eq4gGH6uagJSLs9wADpqpdpYmNNs3thvZfJVct-BFYOkE3uQqd_ptN1K6lfkS1VKO_F8LUaFSMq2M9Sa5IRKS9CzPdGtjNXAGFCUTmkbfXCubY4D_j_PLMUqkxbyo/s1600/RssOpen.png');
background-repeat:no-repeat;
width:150px;
height:43px;
position:fixed;
right:0px;
top:295px;
z-index:1100;
-webkit-transition: all 0.5s ease;
-moz-transition: all 0.5s ease;
-o-transition: all 0.5s ease;
-ms-transition: all 0.5s ease;
transition: all 0.5s ease
}
</style> 

----------------------------------------------------------------------------------------------------------
FLOATING SOCIAL BOOKMARK IN BLOGGER
http://pakdhejohnydemo.blogspot.com/
HOW BUTTON MOVE WITH SCROLLBAR IN SHOPIFY
or remove  theme.liquid  css part or use javascript scroll part 
  @include media-query($medium-up) {
    // Prevent mobile menu inline styles from overriding desktop styles
    // sass-lint:disable no-important
    @include transform(translate3d(0, 0, 0));
  }
OR USE JAVASCRIPT
<script type="text/javascript">//<![CDATA[
$(window).scroll(function() {
var winScrollTop = $(window).scrollTop();
var winHeight = $(window).height();
var floaterHeight = $('.next-prev-product').outerHeight(true);
var fromBottom = 420;
var top = winScrollTop + winHeight - floaterHeight - fromBottom;
$('.next-prev-product').css({'top': top + 'px'});
});
//]]></script>
------------------------------------------------------------------------------------------------------------
<title>Pakdhe Johny Free Simple Blogger Template Responsive</title>
<style>
.social-buttons{position:fixed;top:150px;width:45px;z-index:9999}
.button-left{left:0}
.button-right{right:0}
.social-buttons #twitter-btn .social-icon,.social-buttons #facebook-btn .social-icon,.social-buttons #google-btn 
.social-icon,.social-buttons #rss-btn .social-icon,.social-buttons #pinterest-btn .social-icon,.social-buttons #youtube-btn .social-icon{background-color:#33353B;background-image:url("https://cdn.shopify.com/s/files/1/0042/9811/3117/t/203/assets/mas-icons.png?v=1631999695")}
.button-left #facebook-btn span{background-position:right 10px}
.button-left #twitter-btn span{background-position:right -35px}
.button-left #google-btn span{background-position:right -127px}
.button-left #rss-btn span{background-position:right -80px}
.button-right #facebook-btn span{background-position:12px 10px}
.button-right #twitter-btn span{background-position:11px -35px}
.button-right #google-btn span{background-position:10px -127px}
.button-right #rss-btn span{background-position:11px -80px}
.social-buttons #facebook-btn:hover .social-icon{background-color:#3B5998}
.social-buttons #twitter-btn:hover .social-icon{background-color:#62BDB2}
.social-buttons #google-btn:hover .social-icon{background-color:#DB4A39}
.social-buttons #rss-btn:hover .social-icon{background-color:#FF8B0F}
.social-buttons #pinterest-btn:hover .social-icon{background-color:#D43638}
.social-buttons #youtube-btn:hover .social-icon{background-color:#C4302B}
.social-buttons a:hover .social-text{display:block}
.button-left .social-icon{-moz-transition:background-color .4s ease-in 0;-webkit-transition:background-color .4s ease-in 0;background-repeat:no-repeat;display:block;float:left;height:43px;margin-bottom:2px;width:43px}
.button-left .social-text{display:none;float:right;font-size:1em;font-weight:700;white-space:nowrap;margin:11px 40px 11px 0}
.button-right .social-icon{-moz-transition:background-color .4s ease-in 0;-webkit-transition:background-color .4s ease-in 0;background-repeat:no-repeat;display:block;float:right;height:43px;margin-bottom:2px;width:43px}
.button-right .social-text{display:none;float:left;font-size:80%;font-weight:700;white-space:nowrap;margin:11px 0 11px 40px}
.social-buttons .social-text{color:#FFF}
.button-left #pinterest-btn span,.button-right #pinterest-btn span{background-position:11px -177px}
.button-left #youtube-btn span,.button-right #youtube-btn span{background-position:11px -223px}
</style>
<script src="https://code.jquery.com/jquery-2.2.4.min.js" type="text/javascript"></script>  
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.9.2/jquery-ui.min.js" type="text/javascript"></script>
<script>
$(window).load(function(){
$('.social-buttons .social-icon').mouseenter(function(){
$(this).stop();
$(this).animate({width:'160'}, 500, 'easeOutBounce',function(){});  
});
$('.social-buttons .social-icon').mouseleave(function(){
$(this).stop();
$(this).animate({width:'43'}, 500, 'easeOutBounce',function(){});
});
});
</script>
<div class="social-buttons button-right hidden-phone hidden-tablet">
<a class="itemsocial" href="https://www.facebook.com/your%20FB" id="facebook-btn" target="_blank"><span class="social-icon" style="overflow: hidden; width: 43px;"><span class="social-text">Follow via Facebook</span></span></a>
<a class="itemsocial" href="https://twitter.com/your%20twitter" id="twitter-btn" target="_blank"><span class="social-icon" style="overflow: hidden; width: 43px;"><span class="social-text">Follow via Twitter</span></span></a>
<a class="itemsocial" href="https://plus.google.com/your%20G+" id="google-btn" target="_blank"><span class="social-icon" style="overflow: hidden; width: 43px;"><span class="social-text">Follow via Google</span></span></a>
<a class="itemsocial" href="http://pinterest.com/your%20ID" id="pinterest-btn" target="_blank"><span class="social-icon" style="width: 43px; overflow: hidden;">
<span class="social-text">Follow via Pinterest</span></span></a>
<a class="itemsocial" href="https://www.youtube.com/user/your%20ID" id="youtube-btn" target="_blank"><span class="social-icon" style="overflow: hidden; width: 43px;"><span class="social-text">Follow via Youtube</span></span></a>
<a class="itemsocial" href="http://feeds.feedburner.com/your%20feed" id="rss-btn" target="_blank"><span class="social-icon" style="width: 43px;"><span class="social-text">Follow via RSS</span></span></a>
</div>
------------------------------------------------------------------------------------------------------------













Related Post for FLOAT SHARING BUTTON SOSMED

  • FEATURED AUTOMATED POST SLIDER FOR SIDEBAR ---------------------------------------------------------------------------------------------------- FIND HEAD TAG AND AD THIS CODE BEFORE HEAD TAG FOR MORE…
  • RELATED POST WIDGET LIST WITHOUT THUMBNAIL ------------------------------------------------------------------------------------------------------- FIND HEAD  </head> TAG AND PASTE BELOW CODE WHEN W…
  • Magento Hello World Module (Extension) -------------------------------------------------------------------------------------------------------------- READ MORE: http://inchoo.net/magento/programming-magento/magento-…
  • WHACK A RAT CSS GAME ----------------------------------------------------------------------------------------------------------------- ReadMore: https://dzone.com/articles/css3-games-collection htt…
  • GOOGLE DEVELOPER CONSOLE GOOGLE DOWNLOAD OLD VERSION After you have signed in a user with Google, you can access the user's age range, language, public profile information, and people that they have circled. If you request …
  • HTML CSS GREEN COMMENTS NOTEPAD++ ------------------------------------------------------------------------------------------------------------------------- READ MORE: https://www.youtube.com/watch?v=Abqwpg5mp_U…
  • TEXT COMPARE OR DUPLI TEXT FINDER ------------------------------------------------------------------------------------------------------------------ READ MORE: FIND RED TEXT IN GOOGLE:  text compare downl…
  • IMAGE UPLOAD WITH JAVA WITH PHP CODE ------------------------------------------------------------------------------------------------------ CREATE FOLDER AND CREATE AND SAVE FILES ONE BY ONE IN THIS FOLDER &nb…
  • CSS SYNTAX HIGHLIGHT CHANGE IN NOTEPAD++ SYNTAX HIGHLIGHTER ------------------------------------------------------------------------------------------------------------------- SYNTAX HIGHLIGHTER LINKS -----------------------------------…
  • IMAGE UPLOAD WITH JAVA WITHOUT PHP CODE ------------------------------------------------------------------------------------------------------ COPY AND PASTE BELOW CODE IN NOTE PAD AND SAVE IN HTML FILE -----------…
  • QUICK FIND TOOL GOOGLE CHROME FOR WEB PAGE ------------------------------------------------------------------------------------------------------------------- QUICK FIND TOOL  GOOGLE CHROME FOR WEB PAGE RE…
  • JS IMAGE SCROLLER -------------------------------------------------------------------------------------------------------------- JS IMAGE SCROLLER CODE image scroller https://amazingcarousel.com…
  • FIREBUG LITE USE OFFLINE ------------------------------------------------------------------------------------------------------------- 1)GET CSS CODE BY COPY CSS SELECTOR OR GOOGLE INSPECT 2) OR GET CSS…
  • BOOTSNIPP LOGIN SIGNUP FORM ----------------------------------------------------------------------------------------------------------- READ MORE: http://bootsnipp.com/tags/login http://bootsnipp.com/s…
  • FLASH PLAYER SWF FILE DOWNLOAD ARCHIVES ---------------------------------------------------------------------------------------------------------------- FLASH PLAYER DOWNLOAD FROM ARCHIVES https://helpx.adobe.com/fla…
  • WEB DEVELOPER 0.5 --------------------------------------------------------------------------------------------------------------------- WEB DEVELOPER 0.5 DOWNLOAD BY GIT HUB https://ch…
  • FLASH 8 DOWNLOAD DIRECT LINKS TO YOUR FILES ON GOOGLE DRIVE - YouTube ▶ 5:17 https://www.youtube.com/watch?v=ehue47G5ayc 14 hours ago - Uploaded by SAVE MONEY DIRECT LINKS&n…
Posted by on Friday, 6 September 2013 at 09:57
Labels:

0 comments:

Post a Comment

:) :)) ;(( :-) =)) ;( ;-( :d :-d @-) :p :o :>) (o) [-( :-? (p) :-s (m) 8-) :-t :-b b-( :-# =p~ $-) (b) (f) x-) (k) (h) (c) cheer
Click to see the code!
To insert emoticon you must added at least one space before the code.

Subscribe to: Post Comments (Atom)
FB Gadgets | Template Designed by Fatakat PhotosCoolBThemes.com
Code by : paid web directory

https://www.google.co.uk/search?q=site%3Ablogspot.com+fbgadgets