jquery mobile replace just the content div

jquery, jquery-mobile, mobile

Solution

One way of doing that would be to override the `click` event of the link, and replacing the content of the div (the target) with new content. Doing so in jQuery is trivial, e.g.

 $('#replacement-target').html( $('#source-content').html() );

To play along with jQuery, you may need to call `refresh` on the content to ensure that it is properly styled by the framework.

See this jsFiddle for an example.

Problem

i'm working with jquery mobile and i love the multiple page concept, where you could replace the hole page with another page by just refer to their id. now my app has a navbar (of course), and i hate that when i'm clicking on a link in the navbar the whole page is swiping to the left (inclusive the navbar) and the other page is coming from the right. i just want to replace the content div, the navbar should be fixed on the bottom without refreshing the whole time! do you know what i mean? if i'm just refer to the content div id, it's not working like i refer to the page id. i hope you know what i mean. so how can i handle this?

Original source