更改元素在scroll（）上的位置

Question

Have the following fiddle: http://jsfiddle.net/hpXL4/202/

Trying to get it to work, but can't seem to? Looking to basically change the position of the element after scrolling X height.

var cta = $("#bottomcta");
cta.on("scroll", function(e) { 
  if (this.scrollTop > 50) {
    cta.addClass("fixed");
  } 
    else {
    cta.removeClass("fixed");
  }
});

Answer 1

In your code you are adding or removing a the class every time the scroll function in called. This could result in adding or removing the class "fixed" hundred of times. I don't know if this will fix your problem but I would use

 cta.hasClass("fixed"); 

to check if the class has already been applied to the element before you try adding it.

Answer 2

Necessary to use the Windows elements. Representative link below.... :)

Link

var cta = $(window);
cta.on("scroll", function(e) { 
  if (cta.scrollTop() > 50) {
    $("#bottomcta").addClass("fixed");
  } 
    else {
    $("#bottomcta").removeClass("fixed");
  }
});