Разделы не отображаются

#javascript #html #css

#javascript #HTML #css

Вопрос:

Итак, я новичок в javascript и слабо разбираюсь в CSS и HTML. Я работаю над портфолио, и мои отдельные разделы (для контактов, иллюстраций, проектов) были с display:hidden . Я использовал функцию для каждого раздела, который я хотел скрыть и отобразить соответственно на экране, и они работали нормально, пока я не внес некоторые изменения в общий код. Теперь два раздела не будут отображаться. Вот мой код:

 function out() {
  document.getElementById('trim').style.display = 'none'
  document.getElementById('baby').style.display = 'none'
  document.getElementById('mba').style.display = 'none'
  document.getElementById('blab').style.display = 'none'
  document.getElementById('vdeo').style.display = 'none'
  document.getElementById('outros').style.display = 'block'
}

   <nav>
  <p id="trab">Trabalhos</p> <!--style=" text-decoration: overline;"-->
  <ul style="list-style-type: none; margin: 0; padding: 0;">
    <li id="outros"><button onclick="out()">Outros Projetos</button></li>
    </ul>
  </nav>
   
    <!-- Outros Projetos -->
    <div id="outros" class="otro" style="margin-left:230px; padding-top:200px; padding-right:200px; position: fixed; top:0; display:none;">
      <h5><a href="front.html" target="_blank"> fsf◹</a></h5>
      <p style="font-size:16px;">Duo, som/vídeo</p>
      <br> <!-- 🔗-->
      <h5>Book of Isi</h5>
      <p style="font-size:16px;">(Projeto em construção)</p>
    </div>

Развернуть фрагмент

Это всего лишь один из двух случаев, которые не будут работать, остальные 4 раздела отображаются просто отлично, используя тот же метод.

1. Привет, ваш код работает нормально, можете ли вы кратко описать проблему …… ?

2. Этот раздел, наряду с другим, отображался нормально, пока я не добавил еще один раздел, а значит, еще одну кнопку и другую функцию. Идея заключалась в том, что все эти разделы, которые занимают центр страницы, будут отображаться, только если я нажму для них соответствующую кнопку меню на странице, а остальные будут скрыты. Если я нажму указанную кнопку, она просто появится, как если бы не было никакого содержимого. Однако, если я изменю display:block; прямо на <div> , он появится, НО это не желаемый эффект, поскольку все остальное содержимое сопоставляется с этим.

Ответ №1:

Попробуйте сделать это внутри вашей out() функции

 document.getElementById('outros').style.display = 'block !important'

1. Пробовал, но не отображается. Это действительно странно, потому что та же функция работала нормально, пока я не добавил еще один раздел. Может быть, я добавил слишком много контента? Понятия не имею.

2. Каковы идентификаторы для других разделов. Если у вас одинаковый идентификатор для всех разделов, я не верю, что это сработает

3. Разные идентификаторы.

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

5. Выполнено. Извините за беспорядок!

Ответ №2:

Попробуйте встроить как значение

 document.getElementById('outros').style.display = 'inline'

Ответ №3:

Только что увидел, что я сделал не так, теперь все работает нормально:

У меня был закомментирован другой раздел (раздел видео), потому что я его не использовал. Но я забыл удалить «document.getElementById», который перенаправлял на него из всех функций. Я удалил его, и это сработало.