javascript - Navigation menu fade in on scroll -

javascript - Navigation menu fade in on scroll -

i'm designing website , i'd navigation menu fade in 1 time scroll downwards >50px. i'm using next javascript jquery library:

(function ($) { $(document).ready(function () { $(window).scroll(function () { if ($(this).scrolltop() > 50) { $('.menu').fadein(500); } else { $('.menu').fadeout(500); } }); }); })(jquery);

the class .menu set on {display: none;}.

this should work

$(document).ready(function(){ $(window).bind('scroll', function() { var distance = 50; if ($(window).scrolltop() > distance) { $('nav').fadein(500); } else { $('nav').fadeout(500); } }); });

codepen demo

javascript jquery html css