Nano Hash - криптовалюты, майнинг, программирование

Скрыть заголовки вкладок с помощью Angular UI/Bootstrap UI

Я изо всех сил пытаюсь скрыть заголовок от вкладок, созданных с помощью пользовательского интерфейса Angular.

Для моего решения мне нужно установить кнопки вкладки в заголовке и содержимое в другом контейнере на странице.

Мне нужно скрыть кнопки вкладок, отображаемые директивой.

Есть идеи?

<div id="menuTabs">

<div ng-class="{menuTab: true}" data-ng-click="tabActiveMenu1 = true">Menu1</div>
<div ng-class="{menuTab: true}" data-ng-click="tabActiveMenu2 = true">Menu2</div>
<div ng-class="{menuTab: true}" data-ng-click="tabActiveMenu3 = true">Menu3</div>
<div ng-class="{menuTab: true}" data-ng-click="tabActiveMenu4 = true">Menu4</div>

</div>

<div data-tabset id="menuTabs">
<div data-tab data-active="tabActiveMenu1">
<div data-tab-heading data-ng-class="{hide:true}"></div>        
    Content1
</div>
<div data-tab data-active="tabActiveMenu2">
    <div data-tab-heading data-ng-class="{hide:true}"></div>        
    Content2
</div>
<div data-tab data-active="tabActiveMenu3">
    <div data-tab-heading data-ng-class="{hide:true}"></div>        
    Content3
</div>
 <div data-tab data-active="tabActiveMenu4">
    <div data-tab-heading data-ng-class="{hide:true}"></div>        
    Content4
</div>

angularjs angular-ui-bootstrap angular-ui
08.02.2015

  • Я смущен тем, что вы спрашиваете здесь. Вы пытаетесь заставить кнопку вкладки полностью исчезнуть? Или вы пытаетесь скрыть заголовок веб-страницы? В любом случае, это звучит как ng-hide, ng-show, ng-if и (если вы все еще хотите, чтобы кнопка отображалась, просто отключенная) ng-disabled. Я настоятельно рекомендую изучить эти директивы. 08.02.2015
  • Привет, спасибо за поддержку. С html, который я разместил, у меня было бы две кнопки для активации содержимого. Первый создается внутри элемента menuTabs, а второй будет отображаться с помощью директивы agnular ui tabs. Мне нужно скрыть второй, и я не знаю, как получить к нему доступ через параметры, чтобы добавить класс или любой другой обходной путь. 08.02.2015

Ответы:


1

Если вы хотите скрыть все, кроме активной вкладки, вы можете сделать это в CSS следующим образом:

.nav>li>a {
  display: none;
}
.nav-tabs>li.active>a,
.nav-tabs>li.active>a:hover,
.nav-tabs>li.active>a:focus {
  display: block;
}

демонстрация

Если вы хотите удалить все вкладки и просто показать содержимое, вы можете отредактировать шаблоны или использовать только первое правило выше (так что вкладки всегда скрыты, активны или нет).

10.02.2015
  • Большое спасибо! это дало мне идею. Я делал это слишком сложным. Я не знаю, почему я не мог добавить класс CSS к элементу, но, в конце концов, он работал так, как должен, и я просто сделал .my-menu-class›ul.nav-tabs{display: none} 12.02.2015
  • Отлично. Если он ответил на ваш вопрос, отметьте его соответствующим образом, чтобы другие могли извлечь из него пользу в будущем. 12.02.2015

    • 2

    Я тоже искал способ удалить все заголовки вкладок. Вот что я нашел, что нужно:

    .nav>li>a,
.nav-tabs {
    display: none;
}

    Вторая строка была необходима для удаления сплошной линии внизу заголовков вкладок.

    02.03.2017
    Новые материалы
    Кластеризация: более глубокий взгляд
    Кластеризация — это метод обучения без учителя, в котором мы пытаемся найти группы в наборе данных на основе некоторых известных или неизвестных свойств, которые могут существовать. Независимо от..
    Как написать эффективное резюме
    Предложения по дизайну и макету, чтобы представить себя профессионально Вам не позвонили на собеседование после того, как вы несколько раз подали заявку на работу своей мечты? У вас может..
    Частный метод Python: улучшение инкапсуляции и безопасности
    Введение Python — универсальный и мощный язык программирования, известный своей простотой и удобством использования. Одной из ключевых особенностей, отличающих Python от других языков, является..
    Как я автоматизирую тестирование с помощью Jest
    Шутка для победы, когда дело касается автоматизации тестирования Одной очень важной частью разработки программного обеспечения является автоматизация тестирования, поскольку она создает..
    Работа с векторными символическими архитектурами, часть 4 (искусственный интеллект)
    Hyperseed: неконтролируемое обучение с векторными символическими архитектурами (arXiv) Автор: Евгений Осипов , Сачин Кахавала , Диланта Хапутантри , Тимал Кемпития , Дасвин Де Сильва ,..
    Понимание расстояния Вассерштейна: мощная метрика в машинном обучении
    В обширной области машинного обучения часто возникает необходимость сравнивать и измерять различия между распределениями вероятностей. Традиционные метрики расстояния, такие как евклидово..
    Обеспечение масштабируемости LLM: облачный анализ с помощью AWS Fargate и Copilot
    В динамичной области искусственного интеллекта все большее распространение получают модели больших языков (LLM). Они жизненно важны для различных приложений, таких как интеллектуальные..