igGrid - auto scroll

by georgianastasov

HTML

<script src="https://igniteui.com/js/modernizr.min.js"></script>
<script src="https://code.jquery.com/jquery-1.9.1.min.js"></script>
<script src="https://code.jquery.com/ui/1.10.3/jquery-ui.min.js"></script>
<script src="https://cdn-na.infragistics.com/igniteui/latest/js/infragistics.core.js"></script>
<script src="https://cdn-na.infragistics.com/igniteui/latest/js/infragistics.lob.js"></script>
<script src="https://igniteui.com/js-data/employee-data-allDatatypes"></script>
<link href="https://cdn-na.infragistics.com/igniteui/latest/css/themes/infragistics/infragistics.theme.css" rel="stylesheet"></link>
<link href="https://cdn-na.infragistics.com/igniteui/latest/css/structure/infragistics.css" rel="stylesheet"></link>

<table class="table-header">
  <tr>
    <th>First Name</th>
    <th>Last Name</th>
    <th>Country</th>    
    <th>Age</th>
  </tr>
</table>

<marquee direction="up" onmouseover="this.stop()" onmouseout="this.start()" scrolldelay="50" height="800">
  <table id="grid"></table>
</marquee>

CSS

.ui-widget-header{
  display: none;
}

.table-header {
  font-family: arial, sans-serif;
  border-collapse: collapse;
  width: 100%;
}

.table-header td, th {
  border: 1px solid white;
  text-align: left;
  padding: 8px;
  background-color: #848484;
  color: white;
  width: 20%;
}

JavaScript

$(function () {
var empleyees = [
	{FirstName: "Downs", LastName:"Holomb", Country:"Italy", Age:35},
  {FirstName: "Betty", LastName:"Trujillo", Country:"USA", Age:26},
	{FirstName: "Hollowe", LastName:"Hollkins", Country:"Spain", Age:31},
	{FirstName: "Joyce", LastName:"Munoz", Country:"Germany", Age:23},
	{FirstName: "Mcenzie", LastName:"Calderon", Country:"France", Age:27},
  {FirstName: "Jon", LastName:"Davis", Country:"USA", Age:25},
	{FirstName: "Bratt", LastName:"Calvin", Country:"UK", Age:32},
  {FirstName: "Kony", LastName:"Kel", Country:"France", Age:38},
	{FirstName: "Sam", LastName:"Daren", Country:"Spain", Age:20},
	{FirstName: "Lohn", LastName:"Smith", Country:"USA", Age:31},
  {FirstName: "Downs", LastName:"Holomb", Country:"Italy", Age:35},
  {FirstName: "Betty", LastName:"Trujillo", Country:"USA", Age:26},
	{FirstName: "Hollowe", LastName:"Hollkins", Country:"Spain", Age:31},
	{FirstName: "Joyce", LastName:"Munoz", Country:"Germany", Age:23},
	{FirstName: "Mcenzie", LastName:"Calderon", Country:"France", Age:27},
  {FirstName: "Jon", LastName:"Davis", Country:"USA", Age:25},
	{FirstName: "Bratt", LastName:"Calvin", Country:"UK", Age:32},
  {FirstName: "Kony", LastName:"Kel", Country:"France", Age:38},
	{FirstName: "Sam", LastName:"Daren", Country:"Spain", Age:20},
	{FirstName: "Lohn", LastName:"Smith", Country:"USA", Age:31},
  {FirstName: "Downs", LastName:"Holomb", Country:"Italy", Age:35},
  {FirstName: "Betty", LastName:"Trujillo", Country:"USA", Age:26},
	{FirstName: "Hollowe", LastName:"Hollkins", Country:"Spain", Age:31},
	{FirstName: "Joyce", LastName:"Munoz", Country:"Germany", Age:23},
	{FirstName: "Mcenzie", LastName:"Calderon", Country:"France", Age:27},
  {FirstName: "Jon", LastName:"Davis", Country:"USA", Age:25},
	{FirstName: "Bratt", LastName:"Calvin", Country:"UK", Age:32},
  {FirstName: "Kony", LastName:"Kel", Country:"France", Age:38},
	{FirstName: "Sam", LastName:"Daren", Country:"Spain", Age:20},
	{FirstName: "Lohn",...