JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://code.jquery.com/ui/1.11.1/jquery-ui.js"></script>
<p>Heure d'arrivée...

CSS

body {background: #333;}

p {text-align: center;font: 2em sans-serif;color: #fff;}

div {overflow-y: scroll;width: 80%;height: 500px;margin: auto;position:relative;}
table {margin: 0;padding: 0;table-layout: fixed;width: 100%;font: 1em sans-serif;color: #fff;}
tr:hover td {background: #5FB75D !important;}
td {padding: 25px 20px;background: #3f3f3f;}
td:first-child {width: 100px;}
tr:nth-child(even) td {background: #484848;}

JavaScript

(function($){   

  var	time = new Date(),
    h = time.getHours(),
    m = time.getMinutes();

  var p = $("p"),
    colonneHoraires = $("td:first-child");

  p.append(h+":"+m);

  var scrollToThisPosition;

  for (i=0; i<colonneHoraires.length; i++){

      if (parseInt(colonneHoraires.eq(i).text().split(':')[0]) == h) {

        scrollToThisPosition = colonneHoraires.eq((m/30 < 1) ? i : i+1).position().top;
        break;
      }
  }

  $("div").animate({'scrollTop' : scrollToThisPosition}, 4000, 'easeInOutExpo');

})(jQuery)