Div set hover style, click div after the mouse hover div will trigger hover failure, how to solve?

div sets the hover style, and the hover event is set in jq. Clicking div after the mouse hover div will trigger hover invalidation. How to solve this problem?

  1. html page code

    .box-div{
        width: 200px;
        height: 200px;
        background-color: rgba(255, 255, 255, 1);
        border: 1px solid rgba(220, 220, 220, 1);
        -webkit-user-select:none;
        -moz-user-select:none;
        -ms-user-select:none;
        user-select:none;
    }
    
    .box-div:hover{
        box-shadow: 0px 3px 10px 0px rgba(0, 0, 0, 0.2);
    }
Jan.11,2022

the test did not find your problem
you can post the complete code or write the hover code in css directly into the hover event of jq


I don't quite understand it. It means that if you want to click with hover style, you can add visited style and active style
/ / the style when you click on the element
.box-div:visited {

box-shadow: 0px 3px 10px 0px rgba(0, 0, 0, 0.2);

}
/ / style
.box-div:active {

when the mouse is pressed over the element before it is released
box-shadow: 0px 3px 10px 0px rgba(0, 0, 0, 0.2);

}
in addition, visited had better be written on hover

MySQL Query : SELECT * FROM `codeshelper`.`v9_news` WHERE status=99 AND catid='6' ORDER BY rand() LIMIT 5
MySQL Error : Disk full (/tmp/#sql-temptable-64f5-1e4de7d-43c97.MAI); waiting for someone to free some space... (errno: 28 "No space left on device")
MySQL Errno : 1021
Message : Disk full (/tmp/#sql-temptable-64f5-1e4de7d-43c97.MAI); waiting for someone to free some space... (errno: 28 "No space left on device")
Need Help?