Sunday, November 25, 2012

Add Scrolling Adsense Feature When Scroll Down at Page


As last we said about some Adsense Placing Space like RIGHT, LEFT, CENTER in the blogger but this tutorial is very different be'coz you can make scroll your ads when you scroll down the page and it will show at the bottom of the page. This widget is made by using the JavaScript codes and some little CSS codes which will give a certain good look to your adsense and feel it like a pro. but as we feel that codes are highly sensitive so you can only customize the CSS part and Scrolling effect but from myside I made smoothing scrolling as much as I can. Rest is depend on you.






Read Also- Adsense Unit Placing Pack

4. Add Scrolling Adsense Feature When Scroll Down at Page


Add Scrolling Ad Units

  • Login to Blogger > Dashborad
  • Click on Drop Down Menu and select Layout
  • Add a HTML/JavaScript Gadget
  • Paste below code in it. 

<div id='BeH-Fixed'>
Place Your Adsense Codes Here
    </div>


<script>
window.onload = function() {

  function getScrollTop() {
    if (typeof window.pageYOffset !== 'undefined' ) {
      // Most browsers
      return window.pageYOffset;
    }

    var d = document.documentElement;
    if (d.clientHeight) {
      // IE in standards mode
      return d.scrollTop;
    }

    // IE in quirks mode
    return document.body.scrollTop;
  }

  window.onscroll = function() {
    var box = document.getElementById('BeH-Fixed'),
        scroll = getScrollTop();

    if (scroll <= 2509) {
      box.style.top = "2510px";
    }
    else {
      box.style.top = (scroll + 1) + "px";
    }
  };

}
 </script>
<style>
#BeH-Fixed {

  position: absolute;
  z-index:9999;
}
</style>

  • Save Your Widget and You are done.


Make Changes....!

  • Replace Place Your Adsense Codes Here it with your Adsense OR Chitika Codes.



If Any Problem Comes, Ask in Comments

0 comments:

Post a Comment