JSFiddle - React, Tailwind, and code Playground

HTML

<html>
<head>
<script type="text/javascript">

    $(function() {
        $('ul#img-nav li').css({
            "opacity": .5
        });

        $('ul#img-nav li').hover(function() {
            $(this).stop(true).animate({"opacity":1});
            $(this).children('.overlay').stop(true).animate({"left" : "18px" });
        }, function() {
            $(this).stop(true).animate({"opacity":.5});
            $(this).children('.overlay').stop(true).animate({"left" : "180px" });
        });

    });

</script>
<style type="text/css"> 
    ul#img-nav { width: 100px; overflow:hidden;}
    .overlay {position:relative; left:180px;}
</style>
</head>
<body>

<ul id="img-nav">
    <li>Test<img class="overlay" src="http://www.istockphoto.com/file_thumbview_approve/4430880/2/istockphoto_4430880-wifi-single-icon-series.jpg" height="16px" width="16px" /></li>
    <li>Test<img class="overlay" src="http://www.istockphoto.com/file_thumbview_approve/4430880/2/istockphoto_4430880-wifi-single-icon-series.jpg" height="16px" width="16px" /></li>
    <li>Test<img class="overlay" src="http://www.istockphoto.com/file_thumbview_approve/4430880/2/istockphoto_4430880-wifi-single-icon-series.jpg" height="16px" width="16px" /></li>
    <li>Test<img class="overlay" src="http://www.istockphoto.com/file_thumbview_approve/4430880/2/istockphoto_4430880-wifi-single-icon-series.jpg" height="16px" width="16px" /></li>
    <li>Test<img class="overlay" src="http://www.istockphoto.com/file_thumbview_approve/4430880/2/istockphoto_4430880-wifi-single-icon-series.jpg" height="16px" width="16px" /></li>
</ul>

</body>
</html>