У меня проблема с удалением пробелов, которые я получил при использовании skrollr для создания эффекта параллакса. Я уже ищу и пытаюсь найти решение, которое я получил из множества тем, но я все еще не могу найти ничего, чтобы решить эту проблему, я уже пытался использовать forceheight, но он все еще не работает
это мой HTML:
var s = skrollr.init({
forceHeight: false
});
* {
margin: 0px;
padding: 0px;
}
html {
overflow: scroll;
}
body {
overflow: hidden;
}
::-webkit-scrollbar {
width: 0px;
background: transparent;
/* make scrollbar transparent */
}
body h1,
body h2 {
font-family: 'Niconne', cursive;
}
.overlay {
background: rgba(0, 0, 0, 0.5);
}
.bg-conf {
background-attachment: fixed;
background-position: center center;
background-repeat: no-repeat;
background-size: cover;
width: 100vw;
height: 100vh;
max-height: 100vh;
min-height: 100vh;
}
.main-container {
display: table;
table-layout: fixed;
width: 100vw;
height: 100vh;
overflow: hidden;
position: relative;
/* opacity: 0; */
}
.content-container {
max-width: 450px;
margin: -150px auto 0 auto;
display: table-cell;
vertical-align: middle;
color: black;
padding: 0 8%;
text-align: center;
}
img .img-round {
/* object-fit: cover; */
border-radius: 50%;
}
/* Slide 1 */
#slide-1 .bg-conf {
background-image: url('../img/Slide-1.jpg');
}
<section id="slide-1" style="min-height: 100vh;">
<div class="overlay">
<div class="bg-conf" data-center="background-position: 50% 0px" data-top-bottom="50% -100px" data-anchor-target="#slide-1">
<div class="main-container">
<div class="content-container" data-center="opacity: 1" data-110-top="opacity: 0" data-anchor-target="#slide-1 h1">
<img class="img-rounded" src="img/profile.jpg" alt="profile" style="border-radius: 50%; width: 150px; height: 150px; object-fit: cover;">
<h1>If you don't believe in yourself</h1>
<h1>then just believe in me who believe in you</h1>
<h2>− Rakish F</h2>
</div>
</div>
</div>
</div>
</section>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script>
window.jQuery || document.write('<script src="js/vendor/jquery-1.9.1.min.js"><\/script>')
</script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/skrollr/0.6.30/skrollr.min.js"></script>
Может кто-нибудь мне помочь? Я уже прочитал почти всю ветку про пробелы в скроллре, но до сих пор никто не может помочь мне решить эту проблему
это пробел, который я получил
