псевдокласс css, наведение на один элемент изменяет свойства другого элемента

Question

Мне было интересно, как я могу настроить псевдо-классы CSS, особенно при наведении курсора, чтобы при наведении указателя мыши на элемент, например, div с id, менялись свойства другого div с id?

так обычно это будет:

#3dstack:hover {
  listed properties
}

Я не уверен, что это будет за изменение, если оно будет зависать на div с идентификатором 3dstack и заставит его изменить другой div.

Answer 1

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

#myElement:hover #myElementDescendent {
    background-color: blue;
}

/*or*/

#myElement:hover + #myElementSibling {
    background-color: blue;
}

Конечно, вы всегда можете использовать jquery для этого:

$("#anelement").hover(
    function() {
        $("otherelement").css("background-color", "blue");
    });

См. Различия здесь

Answer 2

Это невозможно только с помощью CSS. Вам придется использовать обработчик событий JavaScript. Например, с помощью jQuery hover:

​$('#3dstack').hover(function() {
    $('#otherID').toggleClass('properties');    
});​​​​​​​

• DEMO

Answer 3

Визуально вы можете сделать это, используя МЕНЬШЕ , но под капотом на самом деле он использует JavaScript.