Hi,
The Back Button is not showing for 2013 Q2 or Q3 Beta. I have a simple test set up and the Back Button will not show unless I go back to Q1 for the
kendo.mobile.all.min.css stylesheet. If I add in the stylesheet from my Q2 or Q3 Beta download, the button does not show even though the link function is there - you just can't see it.
If I reference <link href="http://cdn.kendostatic.com/2013.1.319/styles/kendo.mobile.all.min.css" rel="stylesheet" /> for the style sheet, the button is visible.
Can you confirm the issue?
As I mentioned before, I tried the js and css files from Q2 (v2013.2.918) and Q3 Beta (v2013.3.1030). The only thing that worked was pointing to the Q1 version of the style sheet on the CDN.
Below is my test page.
Thanks.
<!DOCTYPE HTML>
<html lang="en">
<head>
<script src="js/kendo/jquery.min.js"> </script>
<script src="js/kendo/kendo.mobile.min.js"></script>
<link href="styles/kendo/kendo.mobile.all.min.css" rel="stylesheet" />
<style>
.no-backbutton .km-back { visibility: hidden; }
</style>
</head>
<body>
<div data-role="view" id="mt-home-main-view" data-title="Movie Tickets" data-show="homeViewInit" data-layout="mt-main-layout" class="no-backbutton">
Home Page View
</div>
<!-- about view -->
<div data-role="view" id="mt-about-view" data-title="About" data-layout="mt-main-layout">
<div style="padding: 15px">
This is a sample application developed for the book
Building Mobile Applications using Kendo UI Mobile and ASP.NET Web API
</div>
</div>
<div data-role="layout" data-id="mt-main-layout">
<header data-role="header">
<div data-role="navbar">
<a data-align="center" data-role="backbutton">Back</a>
<span data-role="view-title">Movie Tickets</span>
</div>
</header>
<footer data-role="footer">
<div data-role="tabstrip">
<a href="#mt-home-main-view">
<img src="images/movies.ico"
height="40" width="40" /><br />
Movies
</a>
<a href="Trailers.html">
<img src="images/trailers.ico" height="40" width="40" /><br />
Trailers
</a>
<a href="#mt-about-view" data-icon="about">
<br />
About
</a>
</div>
</footer>
</div>
<script>
var application = new kendo.mobile.Application(document.body,
{
transition: 'slide',skin:'flat'
});
console.log(application.view);
</script>
</body>
</html>
The Back Button is not showing for 2013 Q2 or Q3 Beta. I have a simple test set up and the Back Button will not show unless I go back to Q1 for the
kendo.mobile.all.min.css stylesheet. If I add in the stylesheet from my Q2 or Q3 Beta download, the button does not show even though the link function is there - you just can't see it.
If I reference <link href="http://cdn.kendostatic.com/2013.1.319/styles/kendo.mobile.all.min.css" rel="stylesheet" /> for the style sheet, the button is visible.
Can you confirm the issue?
As I mentioned before, I tried the js and css files from Q2 (v2013.2.918) and Q3 Beta (v2013.3.1030). The only thing that worked was pointing to the Q1 version of the style sheet on the CDN.
Below is my test page.
Thanks.
<!DOCTYPE HTML>
<html lang="en">
<head>
<script src="js/kendo/jquery.min.js"> </script>
<script src="js/kendo/kendo.mobile.min.js"></script>
<link href="styles/kendo/kendo.mobile.all.min.css" rel="stylesheet" />
<style>
.no-backbutton .km-back { visibility: hidden; }
</style>
</head>
<body>
<div data-role="view" id="mt-home-main-view" data-title="Movie Tickets" data-show="homeViewInit" data-layout="mt-main-layout" class="no-backbutton">
Home Page View
</div>
<!-- about view -->
<div data-role="view" id="mt-about-view" data-title="About" data-layout="mt-main-layout">
<div style="padding: 15px">
This is a sample application developed for the book
Building Mobile Applications using Kendo UI Mobile and ASP.NET Web API
</div>
</div>
<div data-role="layout" data-id="mt-main-layout">
<header data-role="header">
<div data-role="navbar">
<a data-align="center" data-role="backbutton">Back</a>
<span data-role="view-title">Movie Tickets</span>
</div>
</header>
<footer data-role="footer">
<div data-role="tabstrip">
<a href="#mt-home-main-view">
<img src="images/movies.ico"
height="40" width="40" /><br />
Movies
</a>
<a href="Trailers.html">
<img src="images/trailers.ico" height="40" width="40" /><br />
Trailers
</a>
<a href="#mt-about-view" data-icon="about">
<br />
About
</a>
</div>
</footer>
</div>
<script>
var application = new kendo.mobile.Application(document.body,
{
transition: 'slide',skin:'flat'
});
console.log(application.view);
</script>
</body>
</html>
1 Answer, 1 is accepted
0
Hello Scott,
I'm not sure I follow you - you have some CSS on your sample that specifically hides the back button? If you remove it, the back button shows up.
Regards,
Kamen Bundev
Telerik
I'm not sure I follow you - you have some CSS on your sample that specifically hides the back button? If you remove it, the back button shows up.
Regards,
Kamen Bundev
Telerik
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!