-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathREADME
41 lines (27 loc) · 1.33 KB
/
README
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
This id a first version of LoadUp List plugin for jQuery Mobile
You can see demo here http://andrebrov.net/dev/loadup-list/
For any question write to [email protected]
How to use this widget.
On your page create list with defined ID
<div data-role="content" >
<ul data-role="listview" data-inset="true" data-theme="a" id="long-list" style="position:relative;top:0px;">
</ul>
</div>
Then create script block and define two functions: onloadmove and onloadfinish
onloadmove works when you drag list up. For example:
var onloadmove = function(){
$('#loader').remove();
$("#long-list").parent().append("<div id='loader' style=' margin-left: 45% ; margin-right: 49% ;'><img src='images/loader.gif' alt='Loading...'/></div>");
}
This function insert animated gif, shows loading progress.
onloadfinish works when you release list. In this block i recomed do all ajax request and data initializating
var onloadfinish = function(){
$("#long-list li:last-child").removeClass("ui-corner-bottom");
$("#long-list li:last-child").attr("tabindex","-1");
$("#long-list").append('<li role="option" tabindex="0" class="ui-li ui-li-static ui-btn-up-a ui-corner-bottom">2</li>');
$("#long-list").animate({ top: 0}, "fast");
$('#loader').remove();
}
And then add next line
$("#long-list").loadup(onloadmove,onloadfinish);
Profit!