0

I am using jquery mobile 1.4.2

I have added some css to "data-role="page" so that i can avoid default scrolling of jquery mobile. When i added its affecting my footer.I am not able to fix it( and i don't want to use position:fixed). I want footer always at the bottom of the page.But if the content is to less i want this to at the bottom of a window(screen).

here is a link to jsfiddle

click here

If i add absolute to the footer its working fine when the content is less than the screen size.If it is more than the screen size it overlapping. You an see this by varying out put frame of the jsfiddle vertically.

user3350169
  • 209
  • 1
  • 4
  • 14
  • Can the question be a duplicate of http://stackoverflow.com/questions/6861764/jquery-mobile-stick-footer-to-bottom-of-page – Bhabani Sankar Mishra Oct 22 '14 at 05:58
  • @BhabaniMishra I tried it but its not working.It because of i have added bottom:0 for "data-role:page" if i remove that than footer will work properly.But i want "bottom:0" at "data-role:page" to avoid default scrooling of jqm. – user3350169 Oct 22 '14 at 06:03
  • How about just sizing the content div to the screen size minus header and footer: http://jqmtricks.wordpress.com/2014/02/06/content-div-height-fill-page-height/ – ezanker Oct 22 '14 at 13:56

1 Answers1

0

did you try this ,

<div data-role="footer" data-theme="o" data-position="fixed" data-tap-toggle="false">
 <div> I am Footer </div>    
</div>
Sara
  • 274
  • 4
  • 13
  • I don't want fixed footer I want dynamic position of a footer.And it should stay at bottom when the content is less. – user3350169 Oct 22 '14 at 06:41