how can I fix the jumpiness problem on a moving <LI> stream jQTouch mobile web app (iPhone JavaScript)

I've got a mobile Web app built with jQTouch mobile web app framework, but when I try to add dynamic <LI> elements the theme starts jump开发者_如何学JAVAing around like crazy. Includes a short JavaScript sample program that replicates the issue.

I posted this issue on the jqtouch Google Code ticket system

Issue 134: slidedown prepends LI but causes theme-jumpiness after 15 items or so w/sample code http://code.google.com/p/jqtouch/issues/detail?id=134

Do you have any video elements on your page?

I had a similar problem when I had video elements on the same page as the list.

To get around it: * Create a div for the video * Set the video dimensions to 1px * 1px * Set the background of the div to the video thumbnail pic * Set the div display to block * Insert a link in the div that plays the video with some javascript:

That resolved the jerkiness.

I discovered the problem but not a workaround yet:

in the file themes/jqt/theme.css

remove the following lines to reduce/eliminate the jumpiness:

ul.rounded li:first-child, ul.rounded li:first-child a {
    border-top: 0;
    -webkit-border-top-left-radius: 8px;
    -webkit-border-top-right-radius: 8px;
}

I worked with Brian on the application in question. It appears that the phone is completely redrawing the viewport with each new item after the first 15 or so.

We're hoping the Stack community will know of a clever workaround!