This question is locked. New answers and comments are not allowed.
I copied the demo that you provided for kendo ui mobile and icenium using a basic list view. The problem is that when i view in the simulator it works fine as the Iphone but wont even load as anyother device. I found a thread talking about moving the covdova.js below the kendo js. This does allow the app to load on all devices but the android theme is not applied to the android devices only the IOS. Is there a problem a soultion to this? Please see the code below:(the sytels are in the main.css)
<!DOCTYPE html>
<html>
<head>
<title></title>
<meta charset="utf-8" />
<script src="cordova.js"></script>
<script src="kendo/js/jquery.min.js"></script>
<script src="kendo/js/kendo.mobile.min.js"></script>
<script src="scripts/hello-world.js"></script>
<link href="kendo/styles/kendo.mobile.all.min.css" rel="stylesheet" />
<link href="styles/main.css" rel="stylesheet" />
</head>
<body>
<div data-role="view" id="tabstrip-home" data-title="Hello World!">
<div data-role="view" data-title="Destinations" id="listview-home">
<ul data-role="listview" data-style="inset" data-type="group">
<li>
Africa
<ul>
<li ><a>Nairobi</a></li>
</ul>
</li>
<li>
America
<ul>
<li ><a>Boston</a></li>
<li ><a>Ottawa</a></li>
<li ><a>San Francisco</a></li>
</ul>
</li>
<li>
Asia
<ul>
<li ><a>Bombay</a></li>
</ul>
</li>
<li>
Australia
<ul>
<li ><a>Melbourne</a></li>
<li ><a>Sydney</a></li>
</ul>
</li>
<li>
Europe
<ul>
<li ><a>Cannes</a></li>
<li ><a>Liverpool</a></li>
<li ><a>London</a></li>
</ul>
</li>
</ul>
</div>
<
<script>
var app = new kendo.mobile.Application(document.body);
</script>
</div>
<div data-role="view" id="tabstrip-uiinteraction" data-title="UI Interaction">
<h1>Say Hello!</h1>
<div id='helloWorldInput'>
<label for="txtName" style="display: inline-block;">Enter your name:</label>
<input type="text" id="txtName" value="" />
</div>
<div id='helloWorldText' style="display:block;"></div>
<div class="buttonArea">
<a id="resetButton" data-role="button" data-click="sayHelloReset" data-icon="refresh">Reset</a>
<a id="submitButton" data-role="button" data-click="sayHello" data-icon="compose">Submit</a>
</div>
</div>
<div data-role="view" id="tabstrip-geolocation" data-title="Geolocation">
<h1>My Location</h1>
<div id="geoLocationContainer">
<div id="myLocation">Unable to get location information. Please check your network connection and try again.</div>
<a id="refreshMap" data-role="button" data-click="getLocation" data-icon="refresh">Refresh Location</a>
<div id="map_canvas"></div>
</div>
</div>
<div data-role="layout" data-id="mobile-tabstrip">
<header data-role="header">
<div data-role="navbar">
<span data-role="view-title"></span>
</div>
</header>
<div data-role="footer">
<div data-role="tabstrip">
<a href="#tabstrip-home" data-icon="home">Home</a>
<a href="#tabstrip-uiinteraction" data-icon="share">UI Interaction</a>
<a href="#tabstrip-geolocation" data-icon="globe">Geolocation</a>
</div>
</div>
</div>
<div data-role="layout" data-id="mobile-tabstrip" data-platform="android">
<div data-role="footer">
<div data-role="tabstrip">
<a href="#tabstrip-home" data-icon="home">Home</a>
<a href="#tabstrip-uiinteraction" data-icon="share">UI Interaction</a>
<a href="#tabstrip-geolocation" data-icon="globe">Geolocation</a>
</div>
</div>
</div>
<script>
var app = new kendo.mobile.Application(document.body, { transition: "slide", layout: "mobile-tabstrip" });
</script>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<title></title>
<meta charset="utf-8" />
<script src="cordova.js"></script>
<script src="kendo/js/jquery.min.js"></script>
<script src="kendo/js/kendo.mobile.min.js"></script>
<script src="scripts/hello-world.js"></script>
<link href="kendo/styles/kendo.mobile.all.min.css" rel="stylesheet" />
<link href="styles/main.css" rel="stylesheet" />
</head>
<body>
<div data-role="view" id="tabstrip-home" data-title="Hello World!">
<div data-role="view" data-title="Destinations" id="listview-home">
<ul data-role="listview" data-style="inset" data-type="group">
<li>
Africa
<ul>
<li ><a>Nairobi</a></li>
</ul>
</li>
<li>
America
<ul>
<li ><a>Boston</a></li>
<li ><a>Ottawa</a></li>
<li ><a>San Francisco</a></li>
</ul>
</li>
<li>
Asia
<ul>
<li ><a>Bombay</a></li>
</ul>
</li>
<li>
Australia
<ul>
<li ><a>Melbourne</a></li>
<li ><a>Sydney</a></li>
</ul>
</li>
<li>
Europe
<ul>
<li ><a>Cannes</a></li>
<li ><a>Liverpool</a></li>
<li ><a>London</a></li>
</ul>
</li>
</ul>
</div>
<
<script>
var app = new kendo.mobile.Application(document.body);
</script>
</div>
<div data-role="view" id="tabstrip-uiinteraction" data-title="UI Interaction">
<h1>Say Hello!</h1>
<div id='helloWorldInput'>
<label for="txtName" style="display: inline-block;">Enter your name:</label>
<input type="text" id="txtName" value="" />
</div>
<div id='helloWorldText' style="display:block;"></div>
<div class="buttonArea">
<a id="resetButton" data-role="button" data-click="sayHelloReset" data-icon="refresh">Reset</a>
<a id="submitButton" data-role="button" data-click="sayHello" data-icon="compose">Submit</a>
</div>
</div>
<div data-role="view" id="tabstrip-geolocation" data-title="Geolocation">
<h1>My Location</h1>
<div id="geoLocationContainer">
<div id="myLocation">Unable to get location information. Please check your network connection and try again.</div>
<a id="refreshMap" data-role="button" data-click="getLocation" data-icon="refresh">Refresh Location</a>
<div id="map_canvas"></div>
</div>
</div>
<div data-role="layout" data-id="mobile-tabstrip">
<header data-role="header">
<div data-role="navbar">
<span data-role="view-title"></span>
</div>
</header>
<div data-role="footer">
<div data-role="tabstrip">
<a href="#tabstrip-home" data-icon="home">Home</a>
<a href="#tabstrip-uiinteraction" data-icon="share">UI Interaction</a>
<a href="#tabstrip-geolocation" data-icon="globe">Geolocation</a>
</div>
</div>
</div>
<div data-role="layout" data-id="mobile-tabstrip" data-platform="android">
<div data-role="footer">
<div data-role="tabstrip">
<a href="#tabstrip-home" data-icon="home">Home</a>
<a href="#tabstrip-uiinteraction" data-icon="share">UI Interaction</a>
<a href="#tabstrip-geolocation" data-icon="globe">Geolocation</a>
</div>
</div>
</div>
<script>
var app = new kendo.mobile.Application(document.body, { transition: "slide", layout: "mobile-tabstrip" });
</script>
</body>
</html>