JSFiddle - React, Tailwind, and code Playground

HTML

<ul class="menu">
        <li><a href="#">Anasayfa</a></li>
        <li><a href="#">Hakkımızda</a></li>
        <li><a href="#">Referanslar</a>
            <ul class="altKat">
                <li><a href="#">Web Tasarım</a></li>
                <li><a href="#">HTML - CSS</a></li>
                <li><a href="#">Wordpress</a></li>
            </ul>
        </li>
        <li><a href="#">Reklam Alanları</a>
            <ul class="altKat">
                <li><a href="#">125x125</a></li>
                <li><a href="#">468x60</a></li>
                <li><a href="#">720x90</a></li>
                <li><a href="#">Tanıtım Yazısı</a></li>
            </ul>
        </li>
        <li><a href="#">İletişim</a></li>
    </ul>

CSS

body {margin: auto; padding: 0; font: 12px Arial;}
        ul, li{list-style: none;}
        a {text-decoration: none;}
        .menu {margin: 30px auto; width: 150px; background-color: #333;}
        .menu li{padding: 12px 15px; display: block; position: relative;}
        .menu li a{color: #f2f2f2;}
        .menu li.aktif, .menu li:hover{background-color: #333;}
        .menu li.aktif a, .menu li:hover a{color: #fff;}
            .altKat {display: none; position: absolute; left: 150px; top: 0; background-color: #333; overflow: hidden;}
            .altKat li {display: block; padding: 10px; width: 150px;}
            .altKat li a{color: #fff;}

JavaScript

$(function(){
        
        $(".menu li").hover(function(){ //Menü içerisindeki "li"nin üzerine gelindiğinde işlem başlat
            $(this).addClass("aktif"); // üzerine gelinen "li"ye aktif sınıfını ata
            $(".altKat", this).fadeIn(); // üzerinde bulunduğumuz nesneye ait alt kategori var ise bunu "fadeIn" methodu ile göster
        },function(){ // eğer mouse'u üzerine geldiğimiz nesnenin üzerinden çekersek
            $(".altKat", this).fadeOut(); // o nesneye ait alt kategorileri gizle
            $(".menu li").removeClass("aktif"); // ve o nesnedeki "aktif" sınıfını sil
        });
        
    });