Non-fixed footer

[JohnVS]

We are using the ASP.NET MVC wrappers for KendoUI Mobile.

Is it possible to have a non-fixed footer for my Views? I tried setting the .Footer() of our MobileLayout, but of course, that fixes the footer to the bottom of the screen.

But what we want is just a simple blurb at the bottom of each View, but it shouldn't be fixed, since the info shouldn't be visible at all times.

I also tried hooking into the "BeforeShow" event of each View to an appendBodyFooter(e) function, which would add a simple <div> element to the $(e.view.element), but for whatever reason, this new div also got stuck to the bottom of the screen! I couldn't find any CSS that was causing the new div to stick, so I'm guessing Kendo must have done it via JS somehow.

Is there any way to have a simple footer at the bottom of each View that is not fixed on the screen?

[Kelly]

My team was able to create a floating footer by creating another view. We weren't fully kendo in our mobile site at this point but I'm pretty sure this idea will still work if you are.

<div id="mainview">
</div>

<div id="floatingview" style="position:fixed;bottom:0px">
</div>

[JohnVS]

Paul, that is just another fixed element, right? As described in my original post, we need a non-fixed footer.

Kendo Reps: is there a way to have a non-fixed footer that appears at the bottom of every view?

[Kiril Nikolov]

Hi John,

I am not sure that I understand exactly what you are trying to achieve. But please take a look at this demo and tell me if this helps.

http://jsbin.com/edAMezu/1/edit
 
Regards,
Kiril Nikolov
Telerik

[JohnVS]

I apologize if I wasn't clear.

Here is an example of what we need:  http://jsbin.com/oDiWuGE/1/edit

We are essentially wanting a footer, like the kind of footer that appears on normal desktop websites. The kind of footer that is only visible at the very end of every web page. We don't want it fixed to the bottom of the window; it just needs to be at the bottom of all the content in the View. So once you scroll to the bottom of the content, the Footer should be there.

Is there any way to include that kind of Footer on every page?

[Kiril Nikolov]

Hello John,

Setting a non-fixed footer in the layout of the mobile application is not supported functionality. This is why you will need to put the footer in every view right before the closing </div> tag of the view. 

I have changed the example a little bit here:

http://jsbin.com/oDiWuGE/6/edit

I want to stress on the fact that if you want to put a border on the footer you will need to use box-sizing: border-box; in your css, as otherwise the horizontal scrolling in your application will be broken, as setting the width to 100% and then applying border gets the footer outside of its container.

I hope this information helps.
 
Regards,
Kiril Nikolov
Telerik