jquery fadeOut div无法淡出

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.

我已经调整了这个小提琴http://jsfiddle.net/onqn2gjj/4/来滚动我的搜索栏,但是一旦搜索栏消失了,我就无法通过点击搜索图标来取回它。

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

如何修改我的脚本以阻止这种情况发生?

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

这是网站:http://uwinat.o2clite.com/

Thanks

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

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

1 个解决方案

#1

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

是因为在滚动上你隐藏了元素的父元素

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

你可以在这里看到它:http://screencast.com/t/zrnNrbeI

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

如果您修复它将起作用: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.

我还建议你使用debouncer为你滚动事件...它自己的滚动事件会杀死你的表现... UnderscoreJS库有一个很好的。

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

也尝试使用css动画而不是Jquery。你应该总是避免使用javascript动画......

#1