This is a migrated thread and some comments may be shown as answers.

Back button not working in firefox

1 Answer 61 Views
SplitView
This is a migrated thread and some comments may be shown as answers.
Dan
Top achievements
Rank 1
Dan asked on 25 Oct 2012, 09:20 PM
Im having trouble with the back button.  For some reason when i hover my mouse over it in Firefox 16.0.1 it doesnt register it as a link when the data-role="backbutton" is applied.  When i remove it it works great. 

When I go into Safari, the back button works.  Its weird, in FF the backbutton is styled pretty poorly, loooks like something isnt working.  Any thoughts on this

<div data-role="pane" data-layout="side-default" data-transition="slide">
    @* Menu: Level 1 *@
    <div data-role="view" data-title="Centro Web Panel" id="side-root">
        <header data-role="header">
            <div data-role="navbar">
               <span data-role="view-title"></span>
            </div>
        </header>
 
        <ul data-role="listview" data-style="inset" @*data-source="splitViewCategories" data-template="categoriesTemplate"*@>
            @* TODO: Get rid of hard coded stuff *@
            <li><a class="km-listview-link" href="#side-inbox" data-role="listview-link">Todo</a></li>   
            <li><a class="km-listview-link" href="" data-role="listview-link">Drafts</a></li>   
            <li><a class="km-listview-link" href="" data-role="listview-link">Pending</a></li>   
            <li><a class="km-listview-link" href="" data-role="listview-link">Completed</a></li
        </ul>
    </div>
 
    <div data-role="view" data-title="Todo" id="side-inbox">
        <header data-role="header">
            <div data-role="navbar">
                <a id="back-button" class="nav-button" data-align="left" data-role="backbutton">Back</a>
                <span data-role="view-title"></span>
            </div>
        </header>
         
        <ul data-role="listview" data-style="inset">
            <li><a class="km-listview-link" href="" data-role="listview-link">Cardiology</a></li>   
            <li><a class="km-listview-link" href="" data-role="listview-link">Radiology</a></li>   
            <li><a class="km-listview-link" href="" data-role="listview-link">All Patients</a></li>   
        </ul>
    </div>
 
</div> @* --> end of left menu area *@

1 Answer, 1 is accepted

Sort by
0
Kamen Bundev
Telerik team
answered on 31 Oct 2012, 07:57 AM
Hi Dan,

Kendo UI Mobile is fully supported in WebKit based browsers only. You will most likely face numerous issues in Firefox due to its broken Flexbox support and not supporting image masks. The SplitView will misbehave for sure, please avoid using it if you plan to deploy to Firefox.

That said, we do provide a SVG workaround for the masks, so, in order to get the button icons and the back button working, your server has to be configured to serve SVG files - the correct mime type is image/svg+xml. This issue will be avoided in Q3 when we will switch to icon fonts.

Kind regards,
Kamen Bundev
the Telerik team
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
Tags
SplitView
Asked by
Dan
Top achievements
Rank 1
Answers by
Kamen Bundev
Telerik team
Share this question
or