There is such a script:

jQuery.fn.fadeElements = function (a) { $(this).hover(function () { $(this).stop(true, true).fadeTo(a.inTime, a.inOpacity); }, function () { $(this).stop(true, true).delay(a.delayTime).fadeTo(a.outTime, a.outOpacity); }); }; $(function () { $('#ubar').fadeElements({ inOpacity: 1, outOpacity: 0.1, inTime: 200, outTime: 200, delayTime: 1000 }); });

How to make it so that if we scroll the site down to the bottom, then the block with #ubar would disappear smoothly, i.e. display: none, but at the same time, so as not to argue with the script above, which smoothly shows and hides the block when aiming at it?

  • And with what joy in general should he, as you said, “argue”? Or, from today, the possibility to hang several events on an object was canceled? - Deonis
  • Well, OK. And how to make it so that when you “hit” the bottom of the block website, display: none was applied smoothly, but when we get off, then display: block - inferusvv

1 answer 1

See an example of solving the problem.

 $.fn.fadeElements = function(a){ $(this).hover(function(){ $(this).stop(true,true).fadeTo(a.inTime,a.inOpacity); },function(){ $(this).stop(true,true).delay(a.delayTime).fadeTo(a.outTime,a.outOpacity); }); }; $('#ubar').fadeElements({ inOpacity:1, outOpacity:0.3, inTime:200, outTime:200, delayTime:1000 }); /* -- */ var currentScrollTop = 0; var dH = parseInt($(document).height() - $(window).height(),10); $(window).scroll(function(e){ currentScrollTop = $(window).scrollTop(); if(dH <= currentScrollTop){ $('#ubar').fadeOut(1000); } else { $('#ubar').fadeIn(1000); } });
  • no reaction. In css you need to prescribe what thread? - inferusvv
  • What does any reaction mean? I threw you a living example. See the link - Deonis
  • Excellent reaction! - Palmervan
  • @ inferus-vv, flashed the idea that you did not wrap all the code in dom-ready. Put everything I wrote between the following code: $ (function () {// here is all the code}); - Deonis
  • Yes you are right. My most common mistake. And why when I twist up, the block does not appear immediately. Those. you need to scroll the wheel up 2 steps, only then it will appear - inferusvv