私はこのスクリプトを別のウェブサイトからコピーしました。私はここで何が間違っているのか分かりません。スクリプトは、クラスを削除/追加することを想定していますが、何らかの理由でそれが機能していません。スクロールアップのNav表示
私はこのURLでそれをテストし、ここでそれは私が本当に何かが欠けてる気持ちを持って、このURL http://18493.hosts.ma-cloud.nl/
に取り組んNOGあるいくつかの理由については完全 http://rubenkoops.nl/script_library/cms/content/01-home/nav_hide_on_scroll_html_preview/
取り組んでいます誰かがこれを理解できますか?
<header></header>
いますが、
<div id="header"></div>
ですから、論理的に2つのソリューションを持っています
<style type="text/css">
header {
background: #f5b335;
height: 40px;
position: fixed;
top: 0;
left: 0;
transition: top 0.2s ease-in-out;
width: 100%;
}
.nav-up {
top: -40px;
}
</style>
<script type='text/javascript'>//<![CDATA[
$(function(){
// Hide Header on on scroll down
var didScroll;
var lastScrollTop = 0;
var delta = 5;
var navbarHeight = $('header').outerHeight();
$(window).scroll(function(event){
didScroll = true;
});
setInterval(function() {
if (didScroll) {
hasScrolled();
didScroll = false;
}
}, 250);
function hasScrolled() {
var st = $(this).scrollTop();
// Make sure they scroll more than delta
if(Math.abs(lastScrollTop - st) <= delta)
return;
// If they scrolled down and are past the navbar, add class .nav-up.
// This is necessary so you never see what is "behind" the navbar.
if (st > lastScrollTop && st > navbarHeight){
// Scroll Down
$('header').removeClass('nav-down').addClass('nav-up');
} else {
// Scroll Up
if(st + $(window).height() < $(document).height()) {
$('header').removeClass('nav-up').addClass('nav-down');
}
}
lastScrollTop = st;
}
});//]]>
</script>
<header class="nav-down">
Dit is het menu
</header>
おかげを使用し、私はちょうどそれをしなかった推測するスクリプト! – apielotje
私は2つのリンクを掲示しました、1つは動作し、1つはありません、問題は、私はなぜか分かりません。 – apielotje