CSS для наведения, который включает в себя все дочерние элементы

Question

У меня есть перетаскиваемый элемент div в стиле hover. Это прекрасно работает, но div содержит некоторые элементы формы (метка, ввод). Проблема в том, что когда мышь находится над этими дочерними элементами, наведение отключено.

<div class="app_setting">
  <label">Name</label>
  <input type="text" name="name"/>
</div>

.app_setting:hover {
  cursor:move;
}

Есть какие-нибудь идеи, как заставить навести курсор также на дочерние элементы?

Answer 1

.app_setting *:hover { cursor:move }

Answer 2

Как минимум 2 способа сделать это:

• состояния наведения для каждого дочернего элемента, либо явно, либо с помощью селектора *, как предлагает Гарроу .class *:hover
• каскадное состояние при наведении на детей .class:hover *

Возможно, есть другие

Answer 3

Это не ответ CSS, но он все еще может быть полезен для вас.

Кто-то уже предположил, что вам, возможно, придется прибегнуть к JavaScript для совместимости с браузером. Если вы прибегаете к javascript, вы можете использовать библиотеку jquery, чтобы упростить его.

$(".appsetting").hover(hoverInFunc,hoverOutFunc);

Устанавливает обработчик событий для наведения на и из выбранных элементов, соответствующих селектору стиля css в вызове $().

Answer 4

Возможно, вам придется прибегнуть к JS, чтобы это произошло в IE6.