Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 04.07.2021, 02:05
Интересующийся
Отправить личное сообщение для Tempest Посмотреть профиль Найти все сообщения от Tempest
 
Регистрация: 21.05.2018
Сообщений: 25

Как написать скрипт, чтобы при нажатии на кнопку он скроллил на следующую или предыду
Как сделать так, чтобы при нажатии на стрелку вверх происходил переход на секцию вверх, а при нажатии на стрелку вниз переход на следующую секцию вниз? Я попробовал написать код для стрелки вверх, но у меня не пролистывается на следующую секцию, а сразу уходит на самый вверх.




Сам сайт http://ct03638.tmweb.ru/

Весь код https://jsfiddle.net/sojq3hm0/

<nav class="navbar">
            <ul>
                <li>
                    <a href="#"><i class="far fa-arrow-alt-circle-up"></i></a>
                </li>
                <li>
                    <a href="#main" class="dot active" data-scroll="main">
                        <span>Главная</span>
                    </a>
                </li>
                <li>
                    <a href="#about_us" class="dot" data-scroll="about_us">
                        <span>О нас</span>
                    </a>
                </li>
                <li>
                    <a href="#services" class="dot" data-scroll="services">
                        <span>Услуги</span>
                    </a>
                </li>
                <li>
                    <a href="#sequence" class="dot" data-scroll="sequence">
                        <span>Порядок работы</span>
                    </a>
                </li>
                <li>
                    <a href="#stages" class="dot" data-scroll="stages">
                        <span>Этапы работы</span>
                    </a>
                </li>
                <li>
                    <a href="#portfolio" class="dot" data-scroll="portfolio">
                        <span>Портфолио</span>
                    </a>
                </li>
                <li>
                    <a href="#news" class="dot" data-scroll="news">
                        <span>Новости</span>
                    </a>
                </li>
                <li>
                    <a href="#contacts" class="dot" data-scroll="contacts">
                        <span>Контакты</span>
                    </a>
                </li>
                <li>
                    <a href="#"><i class="far fa-arrow-alt-circle-down"></i></a>
                </li>
            </ul>
</nav>



$(".fa-arrow-alt-circle-up").click(function(e) {
        e.preventDefault();
        $('html,body').animate({ scrollTop: 0 }, 'slow');
    });
Изображения:
Тип файла: jpg 123213.jpg (18.1 Кб, 2 просмотров)
Ответить с цитированием
  #2 (permalink)  
Старый 04.07.2021, 07:28
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,115

Сообщение от Tempest
но у меня не пролистывается на следующую секцию,
находим все кнопки, находим текущую, находим следущую, нажимаем, всё!!!
Ответить с цитированием
  #3 (permalink)  
Старый 04.07.2021, 12:52
Интересующийся
Отправить личное сообщение для Tempest Посмотреть профиль Найти все сообщения от Tempest
 
Регистрация: 21.05.2018
Сообщений: 25

Да это понятно, но я не понимаю как именно код написать, я только только начал все это изучать
Ответить с цитированием
  #4 (permalink)  
Старый 04.07.2021, 13:19
Интересующийся
Отправить личное сообщение для Tempest Посмотреть профиль Найти все сообщения от Tempest
 
Регистрация: 21.05.2018
Сообщений: 25

в документации разберусь, но мне все равно придется писать код для стрелок, а в плагине такого нет
Ответить с цитированием
  #5 (permalink)  
Старый 04.07.2021, 20:46
Интересующийся
Отправить личное сообщение для Tempest Посмотреть профиль Найти все сообщения от Tempest
 
Регистрация: 21.05.2018
Сообщений: 25

Сообщение от Rise Посмотреть сообщение
И что много кода писать?

.fp-arrow-prev,
.fp-arrow-next {
    width: 30px;
    height: 30px;
    margin: 15px 0 15px -3px;
    font-size: 22px;
    color: gray;
    text-align: center;
    cursor: pointer;
    border: 2px solid gray;
    border-radius: 50%;
}

$('#fp-nav')
    .prepend($('<div class="fp-arrow-prev">&uarr;</div>').on('click', function() { fullpage_api.moveSectionUp() }))
    .append($('<div class="fp-arrow-next">&darr;</div>').on('click', function() { fullpage_api.moveSectionDown() }));

А можешь написать, как это осуществить на стрелках, которые у меня уже есть?
Изображения:
Тип файла: jpg Screenshot_3.jpg (141.0 Кб, 1 просмотров)
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
как убрать кнопку, чтобы скрипт срабатывал при потере фокуса поля ввода? Блондинка Общие вопросы Javascript 24 26.04.2021 16:57
Как можно сделать кнопку без ссылки, но с переходом по ссылке при нажатии ? autobuh Элементы интерфейса 10 31.07.2014 05:59
Как сделать, чтобы 2 ссылки отображались как hover при наведении мышкой на любую? Ava Элементы интерфейса 5 19.05.2009 23:24
А как зделать скрипт, чтобы например скрипт 1 заменялся скриптом 2? yura371 Общие вопросы Javascript 3 06.01.2009 22:40
Подскажите как убрать часть текста при нажатии на кномпу или гиперссылку. potkin Общие вопросы Javascript 6 10.10.2008 07:55