0

Столкнулся с проблемой: Hover присваивается к каждому элементу в таблице, а по начальным данным должен работать на каждой ячейке при наведении мыши. Пробывал множество способов расстановки li, ul и элементов классов. Ничего не помогает. В чем я ошибся?

введите сюда описание изображения введите сюда описание изображения

#teamgrouplist li:hover .selizionaton_in_table,
#teamlist li:hover .selizionaton_in_table {
  display: block;
}

#teamgrouplist li:hover a,
#teamlist li:hover a {
  background-color: #00244D !important;
}
<div class="box_content">
  <ul class="sidebar__menu sidebar__menu--left  ">
    <li class="menu-item open scroll" style="max-height: calc(100% - 45px);">
      <ul id="teamgrouplist" class="submenu">
        <li v-for="(t, index) in teams" style="border-radius: 0 0 10px 10px;">
          <div style="width: 100%; position: relative">
            <a :id="[['team_'+t.tid]]" @click="getGroups(t)" :class="{pointer: true, groupExpanded: t.showGroups}" class="linknameteam" style="-webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none;padding-left: 10px;margin-right: 0px; font-size: 9pt;"
              :title="[[t.team_name]]">[[t.team_name | truncate(20,'...')]]
            </a>
          </div>
          <div v-if="t.team_name == selectedTeam" v-for="(g, index2) in t.groups" style="width: 100%; position: relative;">
            <a :id="[['team_group_'+g.gid]]" class="pointer tgitem" @click="getContacts_for_Groups(g)" style="x-webkit-box-shadow: none;
-moz-box-shadow: none; box-shadow: none; margin-right: 0px;font-size: 9pt;background: #00254c;" :title="[[g.group_name]]">
                             [[g.list_name | truncate(20,'...')]]
               </a>
            <div style="position: absolute; right: 5px; top: 5px; width: 30px; height: 30px;overflow: hidden; padding:0px;" class="selizionaton_in_table">

              <a class="remove_item" @click="deleteGroup(g.gid, index2)" style="margin-top:3px; cursor: pointer; -webkit-box-shadow: none; -moz-box-shadow: none;	box-shadow: none; margin-right: 0px; padding: 5px;" alt="Elimina lista" title="Elimina lista">
                <i class="fa fa-minus-circle" aria-hidden="true"></i>
              </a>
            </div>
          </div>
        </li>
      </ul>
    </li>
  </ul>
</div>

6
  • не понятно, как и что надо....
    – Air
    1 ноя 2017 в 16:35
  • @Air при наведении мыши показываются все элементы hover'a , то есть значок минус с права. Пытаюсь сделать что бы был значок справа при наведении только на одну ячейку, и отображался он только в ней. Сейчас когда наводишь мышь на любую ячейку, символ минуса отображается на всех ячейках сразу. А изначально требовалось только что бы на конкретной. 1 ноя 2017 в 16:38
  • сделай минимальный самодостаточный воспроизводимый пример... я там значек минуса не вижу
    – Air
    1 ноя 2017 в 16:41
  • Ошибка в селекторе который выбирает div с классом selizionaton_in_table. Точнее этот селектор выбирает все div. Попробуйте так - #teamgrouplist li:hover > .selizionaton_in_table
    – Tolik Ali
    1 ноя 2017 в 16:42
  • @Air значек минуса это Font Awesome, в коде указан как (<i class="fa fa-minus-circle" aria-hidden="true"></i>) 1 ноя 2017 в 16:46

1 ответ 1

0

Решил проблему которая заключалась в CSS стиле. Переписал и hover заработал именно на конкретном элементе:

#teamgrouplist  li:hover .selizionaton_in_table, #teamlist div:hover .selizionaton_in_table{ display: block; }

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.