JSFiddle - React, Tailwind, and code Playground

HTML

<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>

CSS

div {
    float: left;
    width: 100px;
    height: 50px;
    background: green;
    margin: 5px;
}

JavaScript

$('div').hover(
    function() {
        $('div').not(this).stop(false, false).animate({opacity: 0.15}, 700);
        },
    
    function() {
        $('div').not(this).stop(false, false).animate({opacity: 1}, 300);
        }
);