Result

jQuery

$('a','nav').mouseover(function(){
    $('span','nav').animate({
        'width': $(this).width(),
         'left': $(this).position().left}
    ,'fast');
});

css

nav a{
    text-decoration:none;
    color:#333;
}
nav li{
    display:inline-block;
    margin-left:2px;
    padding:3px; 
    background:#eee;
}
nav span{
    background:#666;
    height:2px;
    display:block;
    position:relative;
    width:50px;
    left:0;
}

html

<nav><ul>
    <li><a href="#">menu01</a></li>
    <li><a href="#">menu02 / 02</a></li>
    <li><a href="#">menu03 / 03 /03</a></li>
    <li><a href="#">menu04 / 04 /04 /04</a></li>
    <li><a href="#">menu05 / 05 /05 /05 /05</a></li>
</ul>
    <span></span>
</nav>

Warning: include(/home/youhei0828/kachibito.net/public_html/wp-content/themes/cocoon-master/my-php/jquery-other-snippets.php): Failed to open stream: No such file or directory in /home/youhei0828/kachibito.net/public_html/wp-content/themes/kachibito7_with_cocoon_child/functions-module/shortcode/add-post-myphp.php on line 7

Warning: include(): Failed opening '/home/youhei0828/kachibito.net/public_html/wp-content/themes/cocoon-master/my-php/jquery-other-snippets.php' for inclusion (include_path='.:/opt/php-8.1.32-2/data/pear') in /home/youhei0828/kachibito.net/public_html/wp-content/themes/kachibito7_with_cocoon_child/functions-module/shortcode/add-post-myphp.php on line 7