javascript - Back to top button not triggering properly -

i have top button appears when scroll little bit .it's working fine when scrolling if footer want button go above footer.

i used jquery animate method change bottom css rule of button when bottom of page.but effect doesn't happen instantly on website because have more javascript , think needs go through code before runs effect , it's not working properly.

where problem ? .here have done : jsfiddle

var offset = 250; var duration = 500; $(window).scroll(function () {     if ($(this).scrolltop() > offset) {         $('.back-to-top').fadein(duration);     } else {         $('.back-to-top').fadeout(duration);     } });  $('.back-to-top').on('click', function () {     event.preventdefault();     $('html,body').animate({ scrolltop: 0 }, duration);     return false; });  $(window).scroll(function () {     if ($(window).scrolltop() + $(window).height() == $(document).height()) {         $('.back-to-top').animate({ 'bottom': '400px' });     } else $('.back-to-top').animate({ 'bottom': '10%' }); }); 

it seems adding class changes position of div, , toggling when condition true solved problem .