Floating side box?

I am using this code suggested on these forums and it works great but I would like to fix one bug.

I would like the box stop at the certain div?

When you scroll it starts floating and then when reaches <div id="footer"> stop!

<style type="text/css">
  .el1{position:fixed;top:15px;right:0;width:100%;background:#f9f9f9;border-bottom:1px solid #cecece;padding:5px 10px 10px;}
  .el2{ position: fixed;left:17px;top: 13px;width: 50%;z-index: 10;}
</style>

<script type='text/javascript'>
  function findPosY(obj) {
    var curtop = 0;
    if (typeof (obj.offsetParent) != 'undefined' && obj.offsetParent) {
      while (obj.offsetParent) {
        curtop += obj.offsetTop;
        obj = obj.offsetParent;
      }
      curtop += obj.offsetTop;
    } else if (obj.y) {
      curtop += obj.y;
    }

    return curtop;
  }

  function stickElement(id, className){
    el = document.getElementById(id);
    if(el.dataset.initialized !== "true"){
      el.dataset.position = findPosY(el);
      el.dataset.initialized = "true";
    }

    if(pageYOffset > el.dataset.position){
      el.classList.add(className);
    } else {
      el.classList.remove(className);
    }
  };

  window.addEventListener("scroll", function(){
    stickElement('floating_share_buttons', "el1");
    stickElement('socials2', "el2");
  });
</script>

Any body please all I want is this: position fixed stop at footer?

Can’t use jQuery has to be JavaScript.

jQuery is JavaScript.

Rephrase then, the OP doesn’t want it to depend on a library.

Can we please see some relevant HTML code too, so that we can simulate the situation that you’re dealing with?

Also, they seem to be fixed near the top of the page. Do you want them to not be fixed when the footer starts to appear at the bottom, when the footer fully appears, or when the footer reaches the fixed items near the top?

Thanks for the reply. This topic was discussed here: JavaScript add CSS to style won't work? - #8 by James_Hibbard

This link is for educational purposes only!

Here on the right side you will see ads and if you scroll down it will float and I would like it to stop before the footer since right now it overlaps it: http://letsforum.com/Forum-Search-Engine-Optimization

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.