0

подскажите пожалуйста, как скрыть .fp-tooltip при переходе на другую секцию через n-е время. https://codepen.io/alexmillern/pen/KKPYpMO пример: клик  Здесь fp-tooltip статичен при переходе на любой

.fp-tooltip
1
  • т.е. Вы хотите чтобы header появился и через 2 секунды к примеру скрылся, а точка осталась, при переходе вниз виден лишь features и снова через 2 секунды скрывается и видны лишь точки?
    – RifmaMan
    27 сен 2019 в 8:11

1 ответ 1

1

Как-то так

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 это время через которое анимация отрабатывает

Ваш ответ

Нажимая на кнопку «Отправить ответ», вы соглашаетесь с нашими условиями использования и подтверждаете, что прочитали и поняли наши политику конфиденциальности и нормы поведения.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.