1 <div data-role="page" id="genlist-bubble" data-add-back-btn="true">
2 <div data-role="header" data-position="fixed">
3 <h1>bubble list (message bubble)</h1>
5 <div data-role="content">
6 <ul data-role="listview" data-style="bubble">
7 <li class="ui-li-bubble-left">short left<span class="ui-li-bubble-time">9:20 PM</span></li>
8 <li class="ui-li-bubble-right">But I have no choice. I have a big exam tomorrow. (bubble right)<span class="ui-li-bubble-time">9:26 PM</span></li>
10 <li class="ui-li-bubble-left">Don't worry... I'm free. You're gonna get sick. (bubble left)<span class="ui-li-bubble-time">9:30 PM</span></li>
11 <li class="ui-li-bubble-date">2010. 05. 20 (bubble date)</li>
12 <li class="ui-li-bubble-right">Sorry I'm late. (bubble right)<span class="ui-li-bubble-time">9:26 PM</span></li>
13 <li class="ui-li-bubble-left ui-li-bubble-sos">Don't worry... I'm free. You're gonna get sick. (bubble sos)<span class="ui-li-bubble-time">9:30 PM</span></li>
14 <li class="ui-li-bubble-left"><p>Picture test</p><img src="list-bubble-sample1.png" /><span class="ui-li-bubble-time">9:40 PM</span></li>