Как скрыть класс css в конкретном слайдере?

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

HTML:

<body>
  <div class = "navigation">
     <div class = "burger_deluxe">
        <span class = "burger_global top_bun"></span>
        <span class = "burger_global patty"></span>
        <span class = "burger_global bottom_bun"></span>
     </div>
  </div>


   <div class = "carousel-item first_slide">
   </div>
   <div class = "carousel-item second_slide">
   </div>
   <div class = "carousel-item third_slide">
   </div>
</body>

CSS:

.navigation {
  width: 100%;
  height: 60px;
  z-index: 400;
  position: absolute;
}
  .burger_deluxe {
  position: absolute;
  top: 15px;
  right: 15px;
  cursor: pointer;
  width: 34px;
  height: 40px;
  z-index: 3;
}
.burger_deluxe .burger_global {
  position: absolute;
  border-top: 5px solid white;
  width: 100%;
}
.burger_deluxe .burger_global.top_bun {
  top: 0;
  border-radius: 20px;
  transition: transform 500ms ease, border 500ms ease;
  transform-origin: left center;
}
.burger_deluxe .burger_global.patty {
  top: 12px;
  border-radius: 20px;
  transition: opacity 500ms ease;
}
.burger_deluxe .burger_global.bottom_bun {
  top: 24px;
  border-radius: 20px;
  transition: transform 500ms ease, border 500ms ease;
  transform-origin: left center;
}
.burger_deluxe.open span {
  border-color: white;
}
.burger_deluxe.open .top_bun {
  transform: rotate(45deg);
}
.burger_deluxe.open .patty {
  opacity: 0;
}
.burger_deluxe.open .bottom_bun {
  transform: rotate(-45deg);
}

Можете ли вы создать демонстрацию, чтобы воспроизвести проблему?

— 13.01.2019 10:38

Подробностей не так много. Если проблема возникает только на первом слайде (я предполагаю, что это слайд во всю ширину), вам может не хватать для него какого-либо класса active / active-slide. Я не вижу ни одного из ваших слайдов с таким индикатором. Обычно библиотеки добавляют такие классы в JS после смены слайдов. Проверьте, так ли это. Если ваша библиотека добавляет какой-либо класс ко второму слайду, если он изменяется, скопируйте этот класс на свой первый слайд в файле HTML.

— 13.01.2019 10:57

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

— 14.01.2019 06:53

javascript jquery html css bootstrap-4

13.01.2019 10:28

Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией

В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.

Концепция локализации и ее применение в приложениях React ⚡️

Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...

Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer

В настоящее время производительность загрузки веб-сайта имеет решающее значение не только для удобства пользователей, но и для ранжирования в...

Безумие обратных вызовов в javascript [JS]

Здравствуйте! Юный падаван 🚀. Присоединяйся ко мне, чтобы разобраться в одной из самых запутанных концепций, когда вы начинаете изучать мир...

Система управления парковками с использованием HTML, CSS и JavaScript

Веб-сайт по управлению парковками был создан с использованием HTML, CSS и JavaScript. Это простой сайт, ничего вычурного. Основная цель -...

JavaScript Вопросы с множественным выбором и ответы

Если вы ищете платформу, которая предоставляет вам бесплатный тест JavaScript MCQ (Multiple Choice Questions With Answers) для оценки ваших знаний,...

Другие вопросы по теме

Как я могу выбрать несколько раз один и тот же параметр в HTML-выборе в jQuery или JS?

Не удается вызвать событие нажатия кнопки закрытия из меню

ASP .NET MVC 5 Отображение записи поиска в таблице без нажатия какой-либо кнопки, как только пользователь начинает вводить текст в поле поиска

Успех всегда запускается, даже если ответ является ошибкой

Как создать анимацию перехода цикла с помощью css transform

Более короткий способ проверить, существует ли заголовок

Как отобразить сумму без обновления?

Я не могу понять, что это на самом деле означает в этом коде

Как изменить текущую дату через 7 дней - [PersianDatepicker]

Как мне загрузить стороннюю библиотеку JS в мой проект Angular6?

Как скрыть класс css в конкретном слайдере?

Другие вопросы по теме

Похожие вопросы