Saturday, August 23, 2014

 

On Scroll Fixed Sidebar Widget for Blogger

We all know that visitors come to our site to visit the main post content and not to see the sidebar content. With the long posts the main sidebar usually goes off to the top Specifically your ads content or Social profiles Widget.

As the solution many sites today are using these type kinds the scripts to fix the element when touch to your top of the browser screen so that the particular widget or element remain visible until user read the post.

The Special Feature about the script we are providing is that is loads faster than other and do not put much load to the page loading. The script is also very user friendly to customize as per your Site Structure. The Script works with 98% of the Blogger Templates available. Demo is not available yet by us, But we Will try to do it soon as possible. Lets learn how to install:






Installation (Installation definition, something installed, as machinery or apparatus placed in position or connected for use. See more.)


  • Go to Blogger dashborad 
  • Open Template and then click on Edit Template
  • Search for </body> tag usually found at your last part of the template
  • Paste the following Script before the Tag.

<script>
// Sticky widget by McQuarro.com
// Tutorial at http://mcquarro.blogspot.com/2014/08/on-scroll-fixed-sidebar-widget-for.html
// Free to use or share, but please keep this notice intact.
//<![CDATA[
bs_makeSticky("YOUR_WIDGET_ID"); // enter your widget ID here
function bs_makeSticky(elem) {
    var bs_sticky = document.getElementById(elem);
    var scrollee = document.createElement("div");
    bs_sticky.parentNode.insertBefore(scrollee, bs_sticky);
    var width = bs_sticky.offsetWidth;
    var iniClass = bs_sticky.className + ' bs_sticky';
    window.addEventListener('scroll', bs_sticking, false);
    function bs_sticking() {
        var rect = scrollee.getBoundingClientRect();
        if (rect.top < 0) {
            bs_sticky.className = iniClass + ' bs_sticking';
            bs_sticky.style.width = width + "px";
        } else {
            bs_sticky.className = iniClass;
        }
    }
}
//]]>
</script>

<style>
.bs_sticking {background:#f2f2f2 !important; position:fixed !important; top:0; z-index:9999; box-shadow:0px 10px 4px -5px rgba(0,0,0,0.3); margin-top: 0; position:relative\9 !important;}
</style> 
 
 
  •  Change YOUR_WIDGET_ID with the elment ID you want to fix for example 
  • HTML1, POPULARPOST1
Posted by date
Labels:
Tags :

Share

Popular Stories

Quotes

Well, the way they make shows is, they make one show. That show's called a pilot. Then they show that show to the people who make shows, and on the strength of that one show they decide if they're going to make more shows.

Like you, I used to think the world was this great place where everybody lived by the same standards I did, then some kid with a nail showed me I was living in his world, a world where chaos rules not order, a world where righteousness is not rewarded. That's Cesar's world, and if you're not willing to play by his rules, then you're gonna have to pay the price.

You think water moves fast? You should see ice. It moves like it has a mind. Like it knows it killed the world once and got a taste for murder. After the avalanche, it took us a week to climb out. Now, I don't know exactly when we turned on each other, but I know that seven of us survived the slide... and only five made it out. Now we took an oath, that I'm breaking now. We said we'd say it was the snow that killed the other two, but it wasn't. Nature is lethal but it doesn't hold a candle to man.

You see? It's curious. Ted did figure it out - time travel. And when we get back, we gonna tell everyone. How it's possible, how it's done, what the dangers are. But then why fifty years in the future when the spacecraft encounters a black hole does the computer call it an 'unknown entry event'? Why don't they know? If they don't know, that means we never told anyone. And if we never told anyone it means we never made it back. Hence we die down here. Just as a matter of deductive logic.