List view gets distorted when scrolling fast

List view gets distorted when scrolling fast

Hi,

I am using jquery-2.1.0 and jquery.mobile-1.4.2.

I have a page which has list view. Following is the code:

   <ul class="someUL" data-role="listview" data-inset="true" data-filter="true">
       <li><img src="../../images/abc.png><h2>Some Name</h2><p>Some Description</p><p>Generated On: 01-02-2013</p><p>Valid Till: 01-02-2014</p></li>
   </ul>

   Code to append <li> to <ul> is written in jquery in a loop in pagebeforecreate event. At max 100 <li> can be added. Now when  Page is displayed and I scroll down, lay out distorts. It seems that page is not able to draw the list fast enough. If I scroll slowly, it works better. Once the entire page is scrolled, if I scroll again, it works better(not best).
   
   Am I doing something wrong. Please advise. I have attached screen shots for reference.
   
   Thanks in advance.