@gabysyss

Как сделать чтобы в скроле менялся контент?

Как сделать скрол-меню, чтобы при выборе одного из пунктов этого меню менялся контент. Примерно как в этом видео
https://cloud.mail.ru/public/J8vB/LGHhrRe2X
  • Вопрос задан
  • 148 просмотров
Решения вопроса 1
Mike_Ro
@Mike_Ro Куратор тега JavaScript
Python, JS, WordPress, SEO, Bots, Adversting
- У Вас 2 контейнера на странице (нужный Вам - второй), какой элемент по счету получает querySelector()?
- Если Вы не знаете точно, зачем Вам получать элементы по классам, или это единственный получаемый такой элемент - используйте id.

Ниже исправленный код, все работает. Вам необходимо добавить в верстке id="select" для списка, и id="output" для вывода:
const list = {
    'Audi': 'Audi AG — немецкая автомобилестроительная компания в составе концерна Volkswagen Group, специализирующаяся на выпуске автомобилей под маркой Audi. Штаб-квартира расположена в Ингольштадте.',
    'Volkswagen': 'Volkswagen — немецкая автомобильная марка, одна из многих, принадлежащих концерну Volkswagen AG. Под этой маркой в 2007 году было реализовано 5 млн 20 тыс. автомобилей. Штаб-квартира — в Вольфсбурге.',
    'Opel': 'Adam Opel AG — немецкий производитель автомобилей. Штаб-квартира расположена в Рюссельсхайме, Германия. Компания была основана 21 января 1863 года и приступила к выпуску автомобилей в 1899 году. С 1929 года принадлежала концерну General Motors.'
}

document.addEventListener('DOMContentLoaded', () => {
    const select = document.querySelector('#select');
    const output = document.querySelector('#output');

    select.addEventListener('change', () => {
        output.textContent = list[select.value];
    });
});

КартинкО
65f325a63b6b4624965081.png
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы