Извините за мой английский. Я изучаю) Итак, мой вопрос: Когда я прокручиваю дно, мне нужно скрыть div, но прокрутка не работает. Когда мой div скрыт, прокрутка будет работать. Я пытаюсь сделать следующий: JS:Прокрутка внизу скрыта div
$(document).ready(function() {
var n = 0;
var deleteBlocks;
$('.trigger').on('click', function(event) {
$('header').addClass('trans');
$('header').addClass('hidden');
n=1;
});
var h = $(window).height();
$(window).scroll(function(){
if ($(this).scrollTop()==0) {
if ($("header").hasClass("hidden")) {
$("header").removeClass("hidden");
n=0;
deleteBlocks = new TweenMax('',0,{delay: 1, onComplete:function() {
$('.text,.trigger').removeClass('disnone');;
}});
}
} else {
$('header').addClass('hidden');
$('header').addClass('trans');
$('.text,.trigger').addClass('disnone');
if (n==0) {
$('html,body').animate({scrollTop: '1px'}, 0);
n=1;
}
}
});
});
CSS:
section {
width: 100%;
height: auto;
background: #;
text-align: center;
}
header {
background: url(../img/slide1.jpg);
background-size: cover;
height: 100vh;
width: 100vw;
position: absolute;
}
.wrapper {
width: 80%;
height: 100%;
margin: 0 auto;
}
.text {
width: 100%;
text-align: center;
padding-top: 30%;
}
.trigger {
margin-top: 20%;
margin-left: 45%;
}
.trans {
-webkit-transition:1s;
transition:1s;
}
.disnone {
display: none;
}
.hidden {
color: red;
height: 0;
opacity: 0;
}
HTML:
<!DOCTYPE html>
<head class="no-js" lang="en">
<meta charset="utf-8">
<title>Исчезающая шапка</title>
<link rel="stylesheet" href="css/style.css" />
<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript" src="js/TweenMax.min.js"></script>
<script type="text/javascript" src="js/main.js"></script>
</head>
<body>
<header class='header'>
<div class="wrapper">
<div class="text tr">
Пробная версия 1.0
</div>
<button class='trigger tr'>CLICK FOR HIDDEN</button>
</div>
</header>
<section>
adadasdasdasdasd<br>
adadasdasdasdasd<br>
adadasdasdasdasd<br>
adadasdasdasdasd<br>
adadasdasdasdasd<br>
adadasdasdasdasd<br>
adadasdasdasdasd<br>
adadasdasdasdasd<br>
adadasdasdasdasd<br>
adadasdasdasdasd<br>
adadasdasdasdasd<br>
adadasdasdasdasd<br>
adadasdasdasdasd<br>
adadasdasdasdasd<br>
adadasdasdasdasd<br>
adadasdasdasdasd<br>
adadasdasdasdasd<br>
adadasdasdasdasd<br>
adadasdasdasdasd<br>
adadasdasdasdasd<br>
adadasdasdasdasd<br>
adadasdasdasdasd<br>
adadasdasdasdasd<br>
adadasdasdasdasd<br>
adadasdasdasdasd<br>
adadasdasdasdasd<br>
adadasdasdasdasd<br>
adadasdasdasdasd<br>
adadasdasdasdasd<br>
adadasdasdasdasd<br>
adadasdasdasdasd<br>
adadasdasdasdasd<br>
adadasdasdasdasd<br>
adadasdasdasdasd<br>
adadasdasdasdasd<br>
adadasdasdasdasd<br>
adadasdasdasdasd<br>
adadasdasdasdasd<br>
adadasdasdasdasd<br>
adadasdasdasdasd<br>
adadasdasdasdasd<br>
adadasdasdasdasd<br>
adadasdasdasdasd<br>
adadasdasdasdasd<br>
adadasdasdasdasd<br>
adadasdasdasdasd<br>
adadasdasdasdasd<br>
adadasdasdasdasd<br>
adadasdasdasdasd<br>
adadasdasdasdasd<br>
adadasdasdasdasd<br>
adadasdasdasdasd<br>
adadasdasdasdasd<br>
adadasdasdasdasd<br>
adadasdasdasdasd<br>
adadasdasdasdasd<br>
adadasdasdasdasd<br>
adadasdasdasdasd<br>
adadasdasdasdasd<br>
adadasdasdasdasd<br>
adadasdasdasdasd<br>
adadasdasdasdasd<br>
adadasdasdasdasd<br>
adadasdasdasdasd<br>
adadasdasdasdasd<br>
adadasdasdasdasd<br>
adadasdasdasdasd<br>
adadasdasdasdasd<br>
adadasdasdasdasd<br>
adadasdasdasdasd<br>
adadasdasdasdasd<br>
adadasdasdasdasd<br>
adadasdasdasdasd<br>
adadasdasdasdasd<br>
adadasdasdasdasd<br>
adadasdasdasdasd<br>
adadasdasdasdasd<br>
adadasdasdasdasd<br>
adadasdasdasdasd<br>
adadasdasdasdasd<br>
adadasdasdasdasd<br>
adadasdasdasdasd<br>
adadasdasdasdasd<br>
adadasdasdasdasd<br>
adadasdasdasdasd<br>
adadasdasdasdasd<br>
adadasdasdasdasd<br>
adadasdasdasdasd<br>
adadasdasdasdasd<br>
adadasdasdasdasd<br>
adadasdasdasdasd<br>
adadasdasdasdasd<br>
adadasdasdasdasd<br>
adadasdasdasdasd<br>
adadasdasdasdasd<br>
adadasdasdasdasd<br>
adadasdasdasdasd<br>
adadasdasdasdasd<br>
adadasdasdasdasd<br>
adadasdasdasdasd<br>
adadasdasdasdasd<br>
adadasdasdasdasd<br>
adadasdasdasdasd<br>
adadasdasdasdasd<br>
adadasdasdasdasd<br>
adadasdasdasdasd<br>
adadasdasdasdasd<br>
adadasdasdasdasd<br>
adadasdasdasdasd<br>
adadasdasdasdasd<br>
adadasdasdasdasd<br>
adadasdasdasdasd<br>
adadasdasdasdasd<br>
</section>
</body>
</html>
Но это не, чем я хочу получить.
Вы можете добавить html тоже? –
Не могли бы вы попытаться воспроизвести проблему в JSFiddle? –
мой код не работает на JSFiddle. Но если вы создадите 3 файла на своем компьютере и скопируете мой код, это будет работать. https://jsfiddle.net/43tqhkfv/ – Daxik