Normally, when you create a data-role="page" element with jQuery mobile, it takes over the entire viewing area. For this reason, I don't understand how to create a sidebar. I'd like to emulate the following, but view source doesn't help much:

<http://jquerymobile.com/demos/1.0b1/docs/lists/index.html>

Notice that when you click an item in the list, it turns into a sidebar and shows another list in the main content area. Additionally, if the display is shrunk enough it only displays the main content area. Is there a special feature in jQuery mobile that allows this, or is there a large amount of opaque javascript and CSS behind it?