This release broke my tabstrips completely.
I tried to run the example from the web site using this release and going from tab to tab doesn't display the new tab contests correctly.
As far as I can see tabstrips just aren't working.
Here is the HTML:
<!DOCTYPE html>
<html>
<head>
<title></title>
<script src="js/jquery.min.js" type="text/javascript"></script>
<script src="js/kendo.web.min.js" type="text/javascript"></script>
<script src="js/kendo.mobile.min.js" type="text/javascript"></script>
<link href="styles/kendo.common.min.css" rel="stylesheet" type="text/css" />
<link href="styles/kendo.dataviz.min.css" rel="stylesheet" type="text/css" />
<link href="styles/kendo.mobile.all.min.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div data-role="view" id="tabstrip-profile" data-title="Profile" data-layout="mobile-tabstrip">
<ul data-role="listview" data-style="inset" data-type="group">
<li>
<ul>
<li>
<h2>
Carine <span>Callahan</span>
</h2>
</li>
<li>
Weekly average sales <span class="sales-up">$ 8,250</span>
</li>
<li>
Monthly average sales <span class="sales-up">$ 32,000</span>
</li>
</ul>
</li>
<li>
Languages
<ul>
<li>
English <span class="value">Native</span>
</li>
<li>
Hungarian <span class="value">Advanced</span>
</li>
<li>
French <span class="value">Advanced</span>
</li>
<li>
Chinese <span class="value">Beginner</span>
</li>
</ul>
</li>
<li>
Sales commodity
<ul>
<li>Beverages</li>
<li>Condiments</li>
<li>Confections</li>
<li>Diary Products</li>
<li>Grains/Cereals</li>
<li>Meat/Poultry</li>
<li>Produce</li>
<li>Seafood</li>
</ul>
</li>
<li>
PC Skills
<ul>
<li>MS Word</li>
<li>MS Excel</li>
<li>MS Outlook</li>
<li>MS PowerPoint</li>
<li>MS Project</li>
<li>Windows (XP, Vista)</li>
<li>Internet</li>
<li>SAP - Sales and Marketing Module</li>
<li>MS Visual Studio</li>
<li>Adobe Acrobat</li>
<li>CorelDraw</li>
</ul>
</li>
</ul>
</div>
<div data-role="view" id="tabstrip-sales" data-title="Sales History" data-layout="mobile-tabstrip">
<ul data-role="listview" data-style="inset" data-type="group">
<li>
Sales 2011
<ul>
<li>
January <span class="sales-up">↑ $ 35,000</span>
</li>
<li>
February <span class="sales-down">↓ $ 25,000</span>
</li>
<li>
March <span class="sales-down">↓ $ 23,000</span>
</li>
<li>
April <span class="sales-up">↑ $ 30,000</span>
</li>
<li>
May <span class="sales-up">↑ $ 31,000</span>
</li>
<li>
June <span class="sales-down">↓ $ 29,000</span>
</li>
<li>
July <span class="sales-up">↑ $ 35,000</span>
</li>
<li>
August <span class="sales-up">↑ $ 37,000</span>
</li>
<li>
September <span class="sales-hold">→ $ 37,000</span>
</li>
<li>
October <span class="sales-hold">→ $ 37,000</span>
</li>
<li>
November <span class="sales-up">↑ $ 38,000</span>
</li>
<li>
December <span class="sales-up">↑ $ 40,000</span>
</li>
</ul>
</li>
</ul>
</div>
<div data-role="view" id="tabstrip-rating" data-title="Rating" data-layout="mobile-tabstrip">
<ul data-role="listview" data-style="inset" data-type="group">
<li>
Sales Representatives
<ul>
<li data-icon="toprated">1. Andrew Fuller</li>
<li data-icon="toprated">2. Janet Leverling</li>
<li data-icon="toprated" style="background-color: #3589e7; color: #fff;">3. Carine Callahan</li>
<li data-icon="toprated">4. Margaret Johnson</li>
<li data-icon="toprated">5. Steve Collins</li>
<li data-icon="toprated">6. Maria Steward</li>
</ul>
</li>
</ul>
</div>
<div data-role="view" id="tabstrip-settings" data-title="Settings" data-layout="mobile-tabstrip">
<ul data-role="listview" data-style="inset" data-type="group">
<li>
Carine Callahan
<ul>
<li>
Notify when online
<input type="checkbox" data-role="switch" checked>
</li>
<li>
Administrator
<input type="checkbox" data-role="switch">
</li>
<li>
Access to stats
<input type="checkbox" data-role="switch" checked>
</li>
</ul>
</li>
</ul>
</div>
<div data-role="layout" data-id="mobile-tabstrip">
<header data-role="header">
<div data-role="navbar">
<!--<a class="nav-button" data-align="left" data-role="backbutton">Back</a>-->
<span data-role="view-title"></span>
<a data-align="right" data-role="button" class="nav-button" href="#index">Index</a>
</div>
</header>
<p>TabStrip</p>
<div data-role="footer">
<div data-role="tabstrip">
<a href="#tabstrip-profile" data-icon="contacts">Profile</a>
<a href="#tabstrip-sales" data-icon="history">Sales</a>
<a href="#tabstrip-rating" data-icon="favorites">Rating</a>
<a href="#tabstrip-settings" data-icon="settings">Settings</a>
</div>
</div>
</div>
<style scoped>
#tabstrip-profile h2
{
display: inline-block;
font-size: 1.1em;
margin: 1.5em 0 0 1em;
}
#tabstrip-profile h2 span
{
display: block;
clear: both;
font-size: 2em;
margin: .2em 0 0 0;
}
#tabstrip-profile img
{
width: 5em;
height: 5em;
float: left;
margin: 1em;
-webkit-box-shadow: 0 1px 3px #333;
box-shadow: 0 1px 3px #333;
-webkit-border-radius: 8px;
border-radius: 8px;
}
.sales-down,
.sales-hold,
.sales-up,
.value
{
float: right;
}
.sales-up { color: green; }
.sales-down { color: red; }
.sales-hold { color: blue; }
.value { color: #bbb; }
</style>
<script>
var app = new kendo.mobile.Application(document.body);
</script>
</body>
</html>
I tried to run the example from the web site using this release and going from tab to tab doesn't display the new tab contests correctly.
As far as I can see tabstrips just aren't working.
Here is the HTML:
<!DOCTYPE html>
<html>
<head>
<title></title>
<script src="js/jquery.min.js" type="text/javascript"></script>
<script src="js/kendo.web.min.js" type="text/javascript"></script>
<script src="js/kendo.mobile.min.js" type="text/javascript"></script>
<link href="styles/kendo.common.min.css" rel="stylesheet" type="text/css" />
<link href="styles/kendo.dataviz.min.css" rel="stylesheet" type="text/css" />
<link href="styles/kendo.mobile.all.min.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div data-role="view" id="tabstrip-profile" data-title="Profile" data-layout="mobile-tabstrip">
<ul data-role="listview" data-style="inset" data-type="group">
<li>
<ul>
<li>
<h2>
Carine <span>Callahan</span>
</h2>
</li>
<li>
Weekly average sales <span class="sales-up">$ 8,250</span>
</li>
<li>
Monthly average sales <span class="sales-up">$ 32,000</span>
</li>
</ul>
</li>
<li>
Languages
<ul>
<li>
English <span class="value">Native</span>
</li>
<li>
Hungarian <span class="value">Advanced</span>
</li>
<li>
French <span class="value">Advanced</span>
</li>
<li>
Chinese <span class="value">Beginner</span>
</li>
</ul>
</li>
<li>
Sales commodity
<ul>
<li>Beverages</li>
<li>Condiments</li>
<li>Confections</li>
<li>Diary Products</li>
<li>Grains/Cereals</li>
<li>Meat/Poultry</li>
<li>Produce</li>
<li>Seafood</li>
</ul>
</li>
<li>
PC Skills
<ul>
<li>MS Word</li>
<li>MS Excel</li>
<li>MS Outlook</li>
<li>MS PowerPoint</li>
<li>MS Project</li>
<li>Windows (XP, Vista)</li>
<li>Internet</li>
<li>SAP - Sales and Marketing Module</li>
<li>MS Visual Studio</li>
<li>Adobe Acrobat</li>
<li>CorelDraw</li>
</ul>
</li>
</ul>
</div>
<div data-role="view" id="tabstrip-sales" data-title="Sales History" data-layout="mobile-tabstrip">
<ul data-role="listview" data-style="inset" data-type="group">
<li>
Sales 2011
<ul>
<li>
January <span class="sales-up">↑ $ 35,000</span>
</li>
<li>
February <span class="sales-down">↓ $ 25,000</span>
</li>
<li>
March <span class="sales-down">↓ $ 23,000</span>
</li>
<li>
April <span class="sales-up">↑ $ 30,000</span>
</li>
<li>
May <span class="sales-up">↑ $ 31,000</span>
</li>
<li>
June <span class="sales-down">↓ $ 29,000</span>
</li>
<li>
July <span class="sales-up">↑ $ 35,000</span>
</li>
<li>
August <span class="sales-up">↑ $ 37,000</span>
</li>
<li>
September <span class="sales-hold">→ $ 37,000</span>
</li>
<li>
October <span class="sales-hold">→ $ 37,000</span>
</li>
<li>
November <span class="sales-up">↑ $ 38,000</span>
</li>
<li>
December <span class="sales-up">↑ $ 40,000</span>
</li>
</ul>
</li>
</ul>
</div>
<div data-role="view" id="tabstrip-rating" data-title="Rating" data-layout="mobile-tabstrip">
<ul data-role="listview" data-style="inset" data-type="group">
<li>
Sales Representatives
<ul>
<li data-icon="toprated">1. Andrew Fuller</li>
<li data-icon="toprated">2. Janet Leverling</li>
<li data-icon="toprated" style="background-color: #3589e7; color: #fff;">3. Carine Callahan</li>
<li data-icon="toprated">4. Margaret Johnson</li>
<li data-icon="toprated">5. Steve Collins</li>
<li data-icon="toprated">6. Maria Steward</li>
</ul>
</li>
</ul>
</div>
<div data-role="view" id="tabstrip-settings" data-title="Settings" data-layout="mobile-tabstrip">
<ul data-role="listview" data-style="inset" data-type="group">
<li>
Carine Callahan
<ul>
<li>
Notify when online
<input type="checkbox" data-role="switch" checked>
</li>
<li>
Administrator
<input type="checkbox" data-role="switch">
</li>
<li>
Access to stats
<input type="checkbox" data-role="switch" checked>
</li>
</ul>
</li>
</ul>
</div>
<div data-role="layout" data-id="mobile-tabstrip">
<header data-role="header">
<div data-role="navbar">
<!--<a class="nav-button" data-align="left" data-role="backbutton">Back</a>-->
<span data-role="view-title"></span>
<a data-align="right" data-role="button" class="nav-button" href="#index">Index</a>
</div>
</header>
<p>TabStrip</p>
<div data-role="footer">
<div data-role="tabstrip">
<a href="#tabstrip-profile" data-icon="contacts">Profile</a>
<a href="#tabstrip-sales" data-icon="history">Sales</a>
<a href="#tabstrip-rating" data-icon="favorites">Rating</a>
<a href="#tabstrip-settings" data-icon="settings">Settings</a>
</div>
</div>
</div>
<style scoped>
#tabstrip-profile h2
{
display: inline-block;
font-size: 1.1em;
margin: 1.5em 0 0 1em;
}
#tabstrip-profile h2 span
{
display: block;
clear: both;
font-size: 2em;
margin: .2em 0 0 0;
}
#tabstrip-profile img
{
width: 5em;
height: 5em;
float: left;
margin: 1em;
-webkit-box-shadow: 0 1px 3px #333;
box-shadow: 0 1px 3px #333;
-webkit-border-radius: 8px;
border-radius: 8px;
}
.sales-down,
.sales-hold,
.sales-up,
.value
{
float: right;
}
.sales-up { color: green; }
.sales-down { color: red; }
.sales-hold { color: blue; }
.value { color: #bbb; }
</style>
<script>
var app = new kendo.mobile.Application(document.body);
</script>
</body>
</html>