JSFiddle - React, Tailwind, and code Playground

by JayData

HTML

<link rel="stylesheet" href="http://cdn.kendostatic.com/2013.2.716/styles/kendo.common.min.css">
<link rel="stylesheet" href="http://cdn.kendostatic.com/2013.2.716/styles/kendo.mobile.all.min.css">
<script src="http://cdn.kendostatic.com/2013.2.716/js/jquery.min.js"></script>
<script src="http://cdn.kendostatic.com/2013.2.716/js/kendo.mobile.min.js"></script>
<div class="app">
    <div data-role="view" data-stretch="true">
        <div id="sc" data-role="scrollview" 
            data-source="dataSource" 
            data-template="scrollview-template"
            data-content-height="120px">
        </div>
    </div>
    <script id="scrollview-template" type="text/x-kendo-template">
        <div style="width: 110px; height: 110px; background-image: #=setBackground(ProductID)#;"></div>
        <p>#= ProductName #</p>
    </script> 
</div>

JavaScript

function setBackground(id) {
    return "url(http://demos.kendoui.com/content/web/foods/" + id +".jpg)";
}

var dataSource = new kendo.data.DataSource({
    type: "odata",
    transport: {
        read: {
            url: "http://demos.kendoui.com/service/Northwind.svc/Products"
        }
    },
    serverPaging: true,
    pageSize: 30
});

/*var dataSource.data([
        { ProductName: 'alma1' },
        { ProductName: 'alma2' },
        { ProductName: 'alma3' }
    ]);*/

var app = new kendo.mobile.Application($('.app'));