jQuery FadeOut div无法淡入

Question

I have adapted this fiddle http://jsfiddle.net/onqn2gjj/4/ to fade my search bar out on scroll, but once the search bar is gone, I cannot get it back by clicking the search icon.

How can I modify my script to stop this from happening please?

Here is the website: http://uwinat.o2clite.com/

Thanks

jQuery(document).ready(function($) {
$(window).scroll(function() {

if ($(this).scrollTop()>0)
 {
    $('.search').fadeOut();
 }
else
 {
  $('.search').fadeIn();
 }
   })
});

Answer 1

Is because on scroll you are hiding the parent of your element

you can see it here: http://screencast.com/t/zrnNrbeI

If you fix that it will work: http://screencast.com/t/H2m7K1636VER

Note

I also recomend you to use a debouncer for you scrolling event... the scroll event by it self would kill your performance... the UnderscoreJS library has a good one.

Also try using css animations instead of Jquery. You should always avoid using javascript animations...