JSFiddle - React, Tailwind, and code Playground

by stecb

HTML

<div class="wrapper">
    <div class="me" id="one"></div>
    <div class="me" id= "two"></div>
</div>

CSS

.me{
    float:left;
    margin-right:20px;
    width:100px;
    height:100px;
     background-color:blue;
}
 

.reduce{
    filter:alpha(opacity=50);
    opacity:0.80;
}

JavaScript

$(document).ready(function(){
    
  $(".wrapper div.me:last").addClass("reduce");
  $(".wrapper div.me").hover(
  function(){
     $(this).fadeTo('fast',1);
     $(".wrapper div").not(this).fadeTo('fast',0.8);
  }); 
});