Question

I am trying to perform some action on some point when user scrolls window. Basically i am using some social networking button on my website when user see article of my website i am showing some tweet and like button on left side of article and when user scroll window down then my tweet and like position is fixed so its stick on there position.

But the problem is when user scroll window down my tweet and like button collides with comment box.so how can i stop from colliding.

My code is :

$(document).ready(function(){
 alert($(".comment-content").offset().top);
  $(window).scroll(function () { 
     if($(window).scrollTop()=="1260"){
               // want to change position of tweet and like button to relative; ( position:relative)
     }
    });
});

Please help me. Thanks.

Answer 1

Use $(element).height() to determine the height of the elements (such as the “comment box”). Use this value to change to position of your tools, e.g:

var offset = $("#comments-box").height();
var mytoolbox = $("#myToolbox");

offset = offset+20; // Function logic (example). Adjust this line to meet your wishes
mytoolbox.css("bottom", offset+"px"); //In conjunction with `position:fixed`
mytoolbox.css("top", offset+"px"); //When used in conjunction with `position:absolute`