Mobile Phone-side Light application simulated native Drop-down refresh effect (JavaScript)
Last Update:2016-09-26
Source: Internet
Author: User
<span id="Label3"></p><p><p>Scenario One: use Iscoll and other frameworks that have a pull-down Function.</p></p><p><p>Analysis: because the structure of the project has been basically completed, and then the use of the framework, and the original structure will affect each other;</p></p><p><p></p></p><p><p>Scenario Two: write with JavaScript and jquery.</p></p><p><p>Analysis: It may not be possible to use the frame directly, but try to keep the effect close to the Native.</p></p><p><p></p></p><p><p>combined, the adoption of programme TWO.</p></p><p><p>/////////////////////////////////////////////////////////////////////////////////////////////////</p></p><p><p>Reference Blog: http://www.cnblogs.com/tqlin/archive/2013/03/04/2942789.html</p></p><p><p>1, index.html</p></p><p><p>Refreshfeedback: Refresh Status Prompt</p></p><p><p>Loading: gif of arrows and loading</p></p><p><p>Tasks: Refreshing content</p></p><pre><span style="color: #0000ff;"><span style="color: #0000ff;"><</span></span><span style="color: #800000;"><span style="color: #800000;">Div</span></span><span style="color: #ff0000;"><span style="color: #ff0000;">ID</span></span><span style="color: #0000ff;"><span style="color: #0000ff;">= "wrapper"</span></span><span style="color: #0000ff;"><span style="color: #0000ff;">></span></span> <span style="color: #0000ff;"><span style="color: #0000ff;"><</span></span><span style="color: #800000;"><span style="color: #800000;">Div</span></span><span style="color: #ff0000;"><span style="color: #ff0000;">ID</span></span><span style="color: #0000ff;"><span style="color: #0000ff;">= "list"</span></span><span style="color: #0000ff;"><span style="color: #0000ff;">></span></span> <span style="color: #0000ff;"><span style="color: #0000ff;"><</span></span><span style="color: #800000;"><span style="color: #800000;">Div</span></span><span style="color: #ff0000;"><span style="color: #ff0000;">ID</span></span><span style="color: #0000ff;"><span style="color: #0000ff;">= "refreshfeedback"</span></span><span style="color: #ff0000;"><span style="color: #ff0000;">style</span></span><span style="color: #0000ff;"><span style="color: #0000ff;">= "width:100%;height:36px;position:absolute;z-index:9;background-color:orange;top:40px;"</span></span><span style="color: #0000ff;"><span style="color: #0000ff;">><</span></span><span style="color: #800000;"><span style="color: #800000;">P</span></span><span style="color: #0000ff;"><span style="color: #0000ff;">></</span></span><span style="color: #800000;"><span style="color: #800000;">P</span></span><span style="color: #0000ff;"><span style="color: #0000ff;">></</span></span><span style="color: #800000;"><span style="color: #800000;">Div</span></span><span style="color: #0000ff;"><span style="color: #0000ff;">></span></span> <span style="color: #0000ff;"><span style="color: #0000ff;"><</span></span><span style="color: #800000;"><span style="color: #800000;">Div</span></span><span style="color: #0000ff;"><span style="color: #0000ff;">></span></span> <span style="color: #0000ff;"><span style="color: #0000ff;"><</span></span><span style="color: #800000;"><span style="color: #800000;">Div</span></span><span style="color: #ff0000;"><span style="color: #ff0000;">ID</span></span><span style="color: #0000ff;"><span style="color: #0000ff;">= "loading"</span></span><span style="color: #ff0000;"><span style="color: #ff0000;">style</span></span><span style="color: #0000ff;"><span style="color: #0000ff;">= "width:92%;height:70px;position:absolute;z-index:0;top:-60px"</span></span><span style="color: #0000ff;"><span style="color: #0000ff;">></span></span> <span style="color: #0000ff;"><span style="color: #0000ff;"><</span></span><span style="color: #800000;"><span style="color: #800000;">P</span></span><span style="color: #0000ff;"><span style="color: #0000ff;">></</span></span><span style="color: #800000;"><span style="color: #800000;">P</span></span><span style="color: #0000ff;"><span style="color: #0000ff;">></span></span> <span style="color: #0000ff;"><span style="color: #0000ff;"></</span></span><span style="color: #800000;"><span style="color: #800000;">Div</span></span><span style="color: #0000ff;"><span style="color: #0000ff;">></span></span> <span style="color: #0000ff;"><span style="color: #0000ff;"><</span></span><span style="color: #800000;"><span style="color: #800000;">Div</span></span><span style="color: #ff0000;"><span style="color: #ff0000;">class</span></span><span style="color: #0000ff;"><span style="color: #0000ff;">= "list-group"</span></span><span style="color: #ff0000;"><span style="color: #ff0000;">ID</span></span><span style="color: #0000ff;"><span style="color: #0000ff;">= "tasks"</span></span><span style="color: #0000ff;"><span style="color: #0000ff;">></span></span> <span style="color: #008000;"><span style="color: #008000;"><!--</span></span><span style="color: #008000;"><span style="color: #008000;">Dynamic Content Generation</span></span><span style="color: #008000;"><span style="color: #008000;"></span> -</span> <span style="color: #0000ff;"><span style="color: #0000ff;"></</span></span><span style="color: #800000;"><span style="color: #800000;">Div</span></span><span style="color: #0000ff;"><span style="color: #0000ff;">></span></span> <span style="color: #0000ff;"><span style="color: #0000ff;"></</span></span><span style="color: #800000;"><span style="color: #800000;">Div</span></span><span style="color: #0000ff;"><span style="color: #0000ff;">></span></span> <span style="color: #0000ff;"><span style="color: #0000ff;"></</span></span><span style="color: #800000;"><span style="color: #800000;">Div</span></span><span style="color: #0000ff;"><span style="color: #0000ff;">></span></span><span style="color: #0000ff;"><span style="color: #0000ff;"></</span></span><span style="color: #800000;"><span style="color: #800000;">Div</span></span><span style="color: #0000ff;"><span style="color: #0000ff;">></span></span></pre><p><p></p></p><p><p>2, App.js</p></p><p><p>Searchtasks (): function to refresh tasks content</p></p><pre><span style="color: #008000;"><span style="color: #008000;">//</span></span><span style="color: #008000;"><span style="color: #008000;">Return Angle</span></span> <span style="color: #0000ff;"><span style="color: #0000ff;">function</span></span><span style="color: #000000;"><span style="color: #000000;">getslideangle (dx, Dy) {</span></span><span style="color: #0000ff;"><span style="color: #0000ff;">return</span></span>Math.atan2 (dy, dx) * 180/<span style="color: #000000;"><span style="color: #000000;">math.pi; }</span></span><span style="color: #008000;"><span style="color: #008000;">//</span></span><span style="color: #008000;"><span style="color: #008000;">return direction based on start and end 1: up, 2: down, 0: not sliding</span></span> <span style="color: #0000ff;"><span style="color: #0000ff;">function</span></span><span style="color: #000000;"><span style="color: #000000;">getslidedirection (startX, starty, endx, endY) {</span></span><span style="color: #0000ff;"><span style="color: #0000ff;">var</span></span>DY = starty-<span style="color: #000000;"><span style="color: #000000;">endY; </span></span><span style="color: #0000ff;"><span style="color: #0000ff;">var</span></span>DX = endx-<span style="color: #000000;"><span style="color: #000000;">startX; </span></span><span style="color: #0000ff;"><span style="color: #0000ff;">var</span></span>result = 0<span style="color: #000000;"><span style="color: #000000;">; </span></span><span style="color: #008000;"><span style="color: #008000;">//</span></span><span style="color: #008000;"><span style="color: #008000;">if the sliding distance is too short</span></span> <span style="color: #0000ff;"><span style="color: #0000ff;">if</span></span>(math.abs (dx) < 2 && Math.Abs (dy) < 2<span style="color: #000000;"><span style="color: #000000;">) { </span></span><span style="color: #0000ff;"><span style="color: #0000ff;">return</span></span><span style="color: #000000;"><span style="color: #000000;">result; } </span></span><span style="color: #0000ff;"><span style="color: #0000ff;">var</span></span>Angle =<span style="color: #000000;"><span style="color: #000000;">Getslideangle (dx, dy); </span></span><span style="color: #0000ff;"><span style="color: #0000ff;">if</span></span>(angle >= && Angle < 135<span style="color: #000000;"><span style="color: #000000;">) {result</span></span>= 1<span style="color: #000000;"><span style="color: #000000;">; } </span></span><span style="color: #0000ff;"><span style="color: #0000ff;">Else</span></span> <span style="color: #0000ff;"><span style="color: #0000ff;">if</span></span>(angle >= -135 && Angle <-45<span style="color: #000000;"><span style="color: #000000;">) {result</span></span>= 2<span style="color: #000000;"><span style="color: #000000;">; } </span></span><span style="color: #0000ff;"><span style="color: #0000ff;">Else</span></span><span style="color: #000000;"><span style="color: #000000;"> { </span></span><span style="color: #0000ff;"><span style="color: #0000ff;">return</span></span><span style="color: #000000;"><span style="color: #000000;">result; } </span></span><span style="color: #0000ff;"><span style="color: #0000ff;">return</span></span><span style="color: #000000;"><span style="color: #000000;">result; } </span></span><span style="color: #0000ff;"><span style="color: #0000ff;">var</span></span><span style="color: #000000;"><span style="color: #000000;">startX, starty; </span></span><span style="color: #0000ff;"><span style="color: #0000ff;">var</span></span>Judge =0<span style="color: #000000;"><span style="color: #000000;">; document.getElementById (</span></span>"list"). AddEventListener (' Touchstart ',<span style="color: #0000ff;"><span style="color: #0000ff;">function</span></span><span style="color: #000000;"><span style="color: #000000;">(ev) {ev</span></span>= EV | | window.event;<span style="color: #008000;"><span style="color: #008000;">//</span></span><span style="color: #008000;"><span style="color: #008000;">compatible with IE</span></span>StartX = Ev.touches[0<span style="color: #000000;"><span style="color: #000000;">].pagex; Starty</span></span>= Ev.touches[0<span style="color: #000000;"><span style="color: #000000;">].pagey; </span></span><span style="color: #008000;"><span style="color: #008000;">//</span></span><span style="color: #008000;"><span style="color: #008000;">Initialize animation time</span></span>$ ("#tasks"). CSS ("transition", "0s")<span style="color: #000000;"><span style="color: #000000;">); $(</span></span>"#loading"). CSS ("transition", "0s")<span style="color: #000000;"><span style="color: #000000;">); </span></span><span style="color: #008000;"><span style="color: #008000;">//</span></span><span style="color: #008000;"><span style="color: #008000;">Initialize the downward arrow</span></span>$ ("#loading p"). css ("transform", "rotate (0deg)"<span style="color: #000000;"><span style="color: #000000;">); $(</span></span>"#loading p"). html (' <span class= ' Glyphicon glyphicon-arrow-down ' ></span> '<span style="color: #000000;"><span style="color: #000000;">); }, </span></span><span style="color: #0000ff;"><span style="color: #0000ff;">false</span></span><span style="color: #000000;"><span style="color: #000000;">); document.getElementById (</span></span>"list"). AddEventListener (' Touchmove ',<span style="color: #0000ff;"><span style="color: #0000ff;">function</span></span><span style="color: #000000;"><span style="color: #000000;">(ev) {judge</span></span>= 0<span style="color: #000000;"><span style="color: #000000;">; EV</span></span>= EV | | window.event;<span style="color: #008000;"><span style="color: #008000;">//</span></span><span style="color: #008000;"><span style="color: #008000;">compatible with IE</span></span> <span style="color: #0000ff;"><span style="color: #0000ff;">var</span></span>shift=event.touches[0].pagey-starty;<span style="color: #008000;"><span style="color: #008000;">//</span></span><span style="color: #008000;">the <span style="color: #008000;">distance the finger is drawn</span> on the screen</span> <span style="color: #0000ff;"><span style="color: #0000ff;">var</span></span>realshift=shift/2; The distance of the actual displacement of the element<span style="color: #0000ff;"><span style="color: #0000ff;">if</span></span>($ (' #wrapper #list '). scrolltop () >0<span style="color: #000000;"><span style="color: #000000;">) {judge</span></span>= 1;<span style="color: #008000;"><span style="color: #008000;">//</span></span><span style="color: #008000;"><span style="color: #008000;">Note that the scroll bar is not at the top and does not need to trigger a drop refresh</span></span> <span style="color: #0000ff;"><span style="color: #0000ff;">return</span></span><span style="color: #000000;"><span style="color: #000000;">; } </span></span><span style="color: #0000ff;"><span style="color: #0000ff;">Else</span></span><span style="color: #000000;"><span style="color: #000000;">{ </span></span><span style="color: #0000ff;"><span style="color: #0000ff;">if</span></span>(shift>0<span style="color: #000000;"><span style="color: #000000;">){ </span></span><span style="color: #008000;"><span style="color: #008000;">//</span></span><span style="color: #008000;"><span style="color: #008000;">The default behavior of scrolling is blocked only when the scroll bar is at the top and when it is down (does not affect the normal behavior of the scroll Bar)</span></span><span style="color: #000000;"><span style="color: #000000;">Event.preventdefault (); </span></span><span style="color: #0000ff;"><span style="color: #0000ff;">if</span></span>(shift<260) {<span style="color: #008000;"><span style="color: #008000;">//</span></span><span style="color: #008000;"><span style="color: #008000;">move to a certain position without moving.</span></span>$ ("#loading"). css ("transform", "translatey" ("+realshift+" px "+") "<span style="color: #000000;"><span style="color: #000000;">); $(</span></span>"#tasks"). css ("transform", "translatey" ("+realshift+" px "+") "<span style="color: #000000;"><span style="color: #000000;">); } </span></span><span style="color: #0000ff;"><span style="color: #0000ff;">if</span></span>(shift>=90) {<span style="color: #008000;"><span style="color: #008000;">//</span></span><span style="color: #008000;"><span style="color: #008000;">move to a certain position the arrow flips vertically</span></span>$ ("#loading p"). css ("transform", "rotate ( -180deg)"<span style="color: #000000;"><span style="color: #000000;">); } </span></span><span style="color: #0000ff;"><span style="color: #0000ff;">Else</span></span><span style="color: #000000;"><span style="color: #000000;">{ $(</span></span>"#loading p"). css ("transform", "rotate (0deg)"<span style="color: #000000;"><span style="color: #000000;">); } } } }, </span></span><span style="color: #0000ff;"><span style="color: #0000ff;">false</span></span><span style="color: #000000;"><span style="color: #000000;">); </span></span><span style="color: #008000;"><span style="color: #008000;">//</span></span><span style="color: #008000;"><span style="color: #008000;">the finger leaves the screen, the element returns to its original</span></span>document.getElementById ("list"). addeventlistener (' touchend '),<span style="color: #0000ff;"><span style="color: #0000ff;">function</span></span><span style="color: #000000;"><span style="color: #000000;">(ev) {ev</span></span>= EV | | window.event;<span style="color: #008000;"><span style="color: #008000;">//</span></span><span style="color: #008000;"><span style="color: #008000;">compatible with IE</span></span> <span style="color: #0000ff;"><span style="color: #0000ff;">var</span></span><span style="color: #000000;"><span style="color: #000000;">endx, endY; EndX</span></span>= Ev.changedtouches[0<span style="color: #000000;"><span style="color: #000000;">].pagex; EndY</span></span>= Ev.changedtouches[0<span style="color: #000000;"><span style="color: #000000;">].pagey; </span></span><span style="color: #0000ff;"><span style="color: #0000ff;">var</span></span>Direction =<span style="color: #000000;"><span style="color: #000000;">getslidedirection (startX, starty, endx, endY); </span></span><span style="color: #0000ff;"><span style="color: #0000ff;">Switch</span></span><span style="color: #000000;"><span style="color: #000000;">(direction) {</span></span><span style="color: #0000ff;"><span style="color: #0000ff;"></span> case</span>0<span style="color: #000000;"><span style="color: #000000;">: </span></span><span style="color: #0000ff;"><span style="color: #0000ff;"></span> break</span><span style="color: #000000;"><span style="color: #000000;">; </span></span><span style="color: #0000ff;"><span style="color: #0000ff;"></span> case</span>1:<span style="color: #008000;"><span style="color: #008000;">//</span></span><span style="color: #008000;"><span style="color: #008000;">Upward</span></span> <span style="color: #0000ff;"><span style="color: #0000ff;"></span> break</span><span style="color: #000000;"><span style="color: #000000;">; </span></span><span style="color: #0000ff;"><span style="color: #0000ff;"></span> case</span>2:<span style="color: #008000;"><span style="color: #008000;">//</span></span><span style="color: #008000;"><span style="color: #008000;">downward</span></span> <span style="color: #0000ff;"><span style="color: #0000ff;">if</span></span>(judge==1<span style="color: #000000;"><span style="color: #000000;">){ </span></span><span style="color: #0000ff;"><span style="color: #0000ff;">return</span></span><span style="color: #000000;"><span style="color: #000000;">; } </span></span><span style="color: #0000ff;"><span style="color: #0000ff;">Else</span></span><span style="color: #000000;"><span style="color: #000000;">{ $(</span></span>"#loading"). CSS ("transition", "0.2s")<span style="color: #000000;"><span style="color: #000000;">); $(</span></span>"#tasks"). CSS ("transition", "0.2s");<span style="color: #008000;"><span style="color: #008000;">//</span></span><span style="color: #008000;"><span style="color: #008000;">a little slower when you restore</span></span><span style="color: #000000;"><span style="color: #000000;"> $(</span></span>"#loading"). css ("transform", "translatey" ("+0+" px "+") "<span style="color: #000000;"><span style="color: #000000;">); $(</span></span>"#tasks"). css ("transform", "translatey" ("+0+" px "+") "<span style="color: #000000;"><span style="color: #000000;">); </span></span><span style="color: #0000ff;"><span style="color: #0000ff;">if</span></span>((endy-starty) >90<span style="color: #000000;"><span style="color: #000000;">){ </span></span><span style="color: #008000;"><span style="color: #008000;">//</span></span><span style="color: #008000;"><span style="color: #008000;">$ ("#tasks"). Empty ();</span></span>$ ("#loading p"). html (' ");<span style="color: #008000;"><span style="color: #008000;">//</span></span><span style="color: #008000;"><span style="color: #008000;">gif pictures of loading</span></span>$ ("#loading"). CSS ("transition-delay", "0.8s");<span style="color: #008000;"><span style="color: #008000;">//</span></span><span style="color: #008000;"><span style="color: #008000;">0.8 seconds delay, simulating the effect of "thinking"</span></span>$ ("#tasks"). CSS ("transition-delay", "0.8s")<span style="color: #000000;"><span style="color: #000000;">); Whichpage</span></span>=<span style="color: #000000;"><span style="color: #000000;">datagrouppage[whichmemory]; Whichpage.pageno</span></span>= 1<span style="color: #000000;"><span style="color: #000000;">; Searchtasks (datagrouppage[whichmemory], memory[whichmemory]). Then (</span></span><span style="color: #0000ff;"><span style="color: #0000ff;">function</span></span><span style="color: #000000;"><span style="color: #000000;">(data) {</span></span><span style="color: #0000ff;"><span style="color: #0000ff;">if</span></span>(data==1<span style="color: #000000;"><span style="color: #000000;">){ $(</span></span>"#refreshFeedback p"). HTML ("refresh succeeded"<span style="color: #000000;"><span style="color: #000000;">); } </span></span><span style="color: #0000ff;"><span style="color: #0000ff;">Else</span></span><span style="color: #000000;"><span style="color: #000000;">{ $(</span></span>"#refreshFeedback p"). HTML ("refresh failed"<span style="color: #000000;"><span style="color: #000000;">); } $(</span></span>"#refreshFeedback"). css ("display", "block"). hide (). delay (. fadeIn (). delay (1200<span style="color: #000000;"><span style="color: #000000;">). FadeOut (); }); } } </span></span><span style="color: #0000ff;"><span style="color: #0000ff;"></span> break</span><span style="color: #000000;"><span style="color: #000000;">; </span></span><span style="color: #0000ff;"><span style="color: #0000ff;">default</span></span><span style="color: #000000;"><span style="color: #000000;">: } }, </span></span><span style="color: #0000ff;"><span style="color: #0000ff;">false</span></span>);</pre><p><p>3, App.css</p></p><pre><span style="color: #800000;"><span style="color: #800000;">#loading P</span></span>{<span style="color: #ff0000;"><span style="color: #ff0000;">width</span></span>:<span style="color: #0000ff;"><span style="color: #0000ff;">100%</span></span>;<span style="color: #ff0000;"><span style="color: #ff0000;">position</span></span>:<span style="color: #0000ff;"><span style="color: #0000ff;">Absolute</span></span>;<span style="color: #ff0000;"><span style="color: #ff0000;">Bottom</span></span>:<span style="color: #0000ff;"><span style="color: #0000ff;">30px</span></span>;<span style="color: #ff0000;"><span style="color: #ff0000;">padding</span></span>:<span style="color: #0000ff;"><span style="color: #0000ff;">0px</span></span>;<span style="color: #ff0000;"><span style="color: #ff0000;">Margin-left</span></span>:<span style="color: #0000ff;"><span style="color: #0000ff;">Auto</span></span>;<span style="color: #ff0000;"><span style="color: #ff0000;">Margin-right</span></span>:<span style="color: #0000ff;"><span style="color: #0000ff;">Auto</span></span>;<span style="color: #ff0000;"><span style="color: #ff0000;">text-align</span></span>:<span style="color: #0000ff;"><span style="color: #0000ff;">Center</span></span>;<span style="color: #ff0000;"><span style="color: #ff0000;">transition</span></span>:<span style="color: #0000ff;"><span style="color: #0000ff;">0.2s</span></span>;<span style="color: #ff0000;"><span style="color: #ff0000;">font-size</span></span>:<span style="color: #0000ff;"><span style="color: #0000ff;">larger</span></span>;<span style="color: #ff0000;"><span style="color: #ff0000;">Color</span></span>:<span style="color: #0000ff;"><span style="color: #0000ff;">Grey</span></span>;}<span style="color: #800000;"><span style="color: #800000;">#loading p img</span></span>{<span style="color: #ff0000;"><span style="color: #ff0000;">width</span></span>:<span style="color: #0000ff;"><span style="color: #0000ff;">20px</span></span>;<span style="color: #ff0000;"><span style="color: #ff0000;">Height</span></span>:<span style="color: #0000ff;"><span style="color: #0000ff;">20px</span></span>;}<span style="color: #800000;"><span style="color: #800000;">#refreshFeedback</span></span>{<span style="color: #ff0000;"><span style="color: #ff0000;">Display</span></span>:<span style="color: #0000ff;"><span style="color: #0000ff;">None</span></span>;}<span style="color: #800000;"><span style="color: #800000;">#refreshFeedback P</span></span>{<span style="color: #ff0000;"><span style="color: #ff0000;">margin</span></span>:<span style="color: #0000ff;"><span style="color: #0000ff;">Auto</span></span>;<span style="color: #ff0000;"><span style="color: #ff0000;">text-align</span></span>:<span style="color: #0000ff;"><span style="color: #0000ff;">Center</span></span>;<span style="color: #ff0000;"><span style="color: #ff0000;">Line-height</span></span>:<span style="color: #0000ff;"><span style="color: #0000ff;">36px</span></span>;<span style="color: #ff0000;"><span style="color: #ff0000;">Color</span></span>:<span style="color: #0000ff;"><span style="color: #0000ff;"></span> white</span>;}</pre><p><p>4, in addition, there is a slide to the part of the page</p></p><pre>$ (' #wrapper #list '). bind (' Scroll ',<span style="color: #0000ff;"><span style="color: #0000ff;">function</span></span><span style="color: #000000;"><span style="color: #000000;"> () { </span></span><span style="color: #0000ff;"><span style="color: #0000ff;">if</span></span>($(<span style="color: #0000ff;"><span style="color: #0000ff;"></span> this</span>). scrolltop () + $ (<span style="color: #0000ff;"><span style="color: #0000ff;"></span> this</span>). innerheight () >= $ (<span style="color: #0000ff;"><span style="color: #0000ff;"></span> this</span>) [0<span style="color: #000000;"><span style="color: #000000;">].scrollheight) {</span></span><span style="color: #008000;"><span style="color: #008000;">//</span></span><span style="color: #008000;"><span style="color: #008000;">if the last refreshed data is less than the number of data that was refreshed by default at a time, the data has been loaded after this refresh, and the data is no longer being requested from the Database. </span></span> <span style="color: #0000ff;"><span style="color: #0000ff;">if</span></span>(lastpagesize<<span style="color: #000000;"><span style="color: #000000;">Datagrouppage[whichmemory].pagesize) { </span></span><span style="color: #0000ff;"><span style="color: #0000ff;">return</span></span><span style="color: #000000;"><span style="color: #000000;">; } </span></span><span style="color: #0000ff;"><span style="color: #0000ff;">Else</span></span><span style="color: #000000;"><span style="color: #000000;">{datagrouppage[whichmemory].pageno</span></span>+ = 1<span style="color: #000000;"><span style="color: #000000;">; Searchtasks (datagrouppage[whichmemory], memory[whichmemory]); } }});</span></span></pre><p><p></p></p><p><p>Mobile Phone-side Light application simulated native Drop-down refresh effect (JavaScript)</p></p></span>
