JSFiddle - React, Tailwind, and code Playground

by Denis

HTML

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<div id="container">
    <ul id="navigationa">
      <li><a href="#">go go go1</a><img id='lol' src="http://s43.radikal.ru/i101/1212/e6/fa537b8ee01d.jpg" alt=""></li>
      <li><a href="#">go go go2</a><img id='lol' src="http://s43.radikal.ru/i101/1212/e6/fa537b8ee01d.jpg" alt=""></li>
      <li><a href="#">go go go3</a><img id='lol' src="http://s43.radikal.ru/i101/1212/e6/fa537b8ee01d.jpg" alt=""></li>
      <li><a href="#">go go go4</a><img id='lol' src="http://s43.radikal.ru/i101/1212/e6/fa537b8ee01d.jpg" alt=""></li>
    </ul>
</div>

CSS

#navigationa{
  position: absolute;
  width: inherit;
  top: 50%;
  right: 30%;
  margin: 0;
}
#navigationa li{
  height: 20px;
  float: left;
  list-style: none;
  width: 70px;
  padding: 3px;
  border-right: 1px solid #3687AF;
  background-color: #015287;
  background-repeat: no-repeat;
  background-position: center 30px;
    overflow: hidden;
}
#navigationa a{
  color: #fff;
  overflow: hidden;
}
#navigationa li img { 
    position: relative;
    top: 5px;        
}

JavaScript

$('#navigationa li').hover(function() {
    $(this).stop(true).animate({height: '60px'}, 500)
}, function() {
    $(this).stop(true).animate({ height: '20px'}, 500)
});