Hover over one element activates the hover state of another element?

Hi, I have nothing to show but curious if it’s feasible to hover over one element and activate the hover state of another element.

For instance, hover over a button, it activates the hover phase of a link block

Sort of link an interaction, but not changing the size etc.



Here is my public share link: LINK
(how to access public share link)

Depends on the structure of these blocks. If it is a parent - child relationship, then it can be solved by css, if it’s an unrelated block, you need to use javascript.


.parentclassname:hover .childclassname {
background-color: yellow;


$(document).ready(function() {
    $(".triggerclassname").hover(function() {
        $(".targetclassname").css("background-color", "yellow");
    }, function() {
        /* when the mouse is out return it back to normal */
        $(".targetclassname").css("background-color", "transparent");

I’m going to give that a go and report back!