Question

向下滚动页面时，我需要隐藏搜索栏。

我知道这是在jquery中完成的，但我真的不知道从哪里开始。我不知道我需要的代码以及如何/在哪里将其正确地包含在Wordpress中。

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

的地方

有人可以帮忙吗？

谢谢。

Answer 1

<script>
//when user start scrolling
jQuery(document).on("scroll", function () {
    //hide search bar
    jQuery('.header .search').removeClass('animated');
    jQuery('.header-cont').removeClass('search-active');
});
</script>

将此代码放在HTML页面的底部应该没问题

Answer 2

someid - target

300 -means top offset px

可见 - 默认情况下删除或添加类并隐藏目标

或反向 - 添加另一个在滚动中隐藏elem的类

var foo = function() {
    var arrow = document.getElementById('someid');
    window.document.addEventListener('scroll', function() {
        var topOffset = document.documentElement.scrollTop || document.body.scrollTop;
        topOffset > 300 ? arrow.classList.add('visible') : arrow.classList.remove('visible');
    });
};
foo();

如何在wordpress中向下滚动元素

2 个答案: