подскажите пожалуйста, как скрыть .fp-tooltip при переходе на другую секцию через n-е время. https://codepen.io/alexmillern/pen/KKPYpMO
пример: клик
.fp-tooltip
Stack Overflow на русском — это сайт вопросов и ответов для программистов. Присоединяйтесь! Регистрация займёт не больше минуты.
Присоединиться к сообществуподскажите пожалуйста, как скрыть .fp-tooltip при переходе на другую секцию через n-е время. https://codepen.io/alexmillern/pen/KKPYpMO
пример: клик
.fp-tooltip
Как-то так
new fullpage('#fullpage', {
licenseKey: 'YOUR KEY HERE',
sectionsColor: ['#333', '#333', '#333', '#333'],
anchors: ['header', 'features', 'works', 'contacts'],
navigation: true,
navigationTooltips: ['header', 'features', 'works', 'contacts'],
showActiveTooltip: true,
});
.section {
text-align:center;
font-size: 3em;
color: #fff
}
#fp-nav ul li a span {
background: #fff;
}
#fp-nav ul li a.active + .fp-tooltip{
-webkit-animation: cssAnimation 3s forwards;
animation: cssAnimation 3s forwards;
}
@keyframes cssAnimation {
0% {opacity: 1;}
90% {opacity: 1;}
100% {opacity: 0;}
}
@-webkit-keyframes cssAnimation {
0% {opacity: 1;}
90% {opacity: 1;}
100% {opacity: 0;}
}
<script src="https://rawgit.com/alvarotrigo/fullPage.js/dev/src/fullpage.js"></script>
<link href="https://rawgit.com/alvarotrigo/fullPage.js/dev/src/fullpage.css" rel="stylesheet"/>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.1/jquery.min.js"></script>
<div id="fullpage">
<div class="section">One</div>
<div class="section">
<div class="slide" data-anchor="slide1">Two 1</div>
<div class="slide" data-anchor="slide2">Two 2</div>
</div>
<div class="section">Three</div>
<div class="section">Four</div>
</div>
animation: cssAnimation 3s forwards;
- 3s это время через которое анимация отрабатывает