Simple pull-down refresh simulation and pull-down refresh
<! Doctype html>
<Html>
<Head>
<Meta charset = "UTF-8">
<Title> untitled document </title>
<Script src = "jquery-1.9.1.js"> </script>
<Script>
$ (Function (){
$ ("# ShowInfo"). scroll (function (){
If ($ (this). height () + $ (this). scrollTop () = $ ("# innerInfo"). outerHeight (true )){
Var str = "<p> hello" + new Date () + "</p>" + "<p> hello" + new Date () + "</p>" + "<p> hello" + new Date () + "</p>" + "<p> hello" + new Date () + "</p>" + "<p> hello" + new Date () + "</p> ";
$ ("# InnerInfo" ).html ($ ("# innerInfo" ).html () + str );
}
});
});
</Script>
<Style>
*{
Padding: 0px;
Margin: 0px auto;
}
# ShowInfo {
Width: 200px;
Height: 200px;
Overflow-y: scroll;
Border: 1px solid # F93;
}
</Style>
</Head>
<Body>
<Div id = "showInfo">
<Div id = "innerInfo">
<P> hello, China. </P>
<P> hello, China. </P>
<P> hello, China. </P>
<P> hello, China. </P>
<P> hello, China. </P>
<P> hello, China. </P>
<P> hello, China. </P>
<P> hello, China. </P>
<P> hello, China. </P>
<P> hello, China. </P>
<P> hello, China. </P>
<P> hello, China. </P>
</Div>
</Div>
</Body>
</Html>