-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathVsWatcher_lazyload.html
49 lines (46 loc) · 5.83 KB
/
VsWatcher_lazyload.html
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
41
42
43
44
45
46
47
48
49
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-Strict.dtd">
<html>
<head>
<title>VisibilityWatcher demo #2</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style>
body { font-family: Arial, Helvetica; background-color: #C0C0C0; }
p { padding:10px; background:#F0F0FF; }
.explanation { background-color: #FFFFFF; border: 2px dashed black; }
</style>
<script type="text/javascript" src="js/jquery1.91.min.js"></script>
<script src="js/asdui.js" type="text/javascript"></script>
<script type="text/javascript">
var newparagraphnumber = 3;
$(function(){
var extender = $('#extender').height(200);
//extender.store('visibilityWatcher',
new ZUI.VsWatcher(extender,{
onEnter: function(){
console.log('load...');
var newcontent = $('<h2>', {html: 'My new little text #' + newparagraphnumber++,css:{'height':100,'color':'#f00'}});
extender.before(newcontent);
$("#chatScroll").scrollTop($("#chatBox")[0].scrollHeight);
}
});
//);
});
</script>
</head>
<body>
<h1>Continuous Load test</h1>
<p class="explanation">
When the document end is reached, a new text paragraph is added automatically.
</p>
<h2>My little text #1</h2>
<p id="textsource">
Lorem ipsum dolor sit amet, consectetuer adipiscing elit.<br/> Sed non risus.<br/> Suspendisse lectus tortor, dignissim sit amet, adipiscing nec, ultricies sed, dolor.<br/> Cras elementum ultrices diam.<br/> Maecenas ligula massa, varius a, semper congue, euismod non, mi.<br/> Proin porttitor, orci nec nonummy molestie, enim est eleifend mi, non fermentum diam nisl sit amet erat.<br/> Duis semper.<br/> Duis arcu massa, scelerisque vitae, consequat in, pretium a, enim.<br/> Pellentesque congue.<br/> Ut in risus volutpat libero pharetra tempor.<br/> Cras vestibulum bibendum augue.<br/> Praesent egestas leo in pede.<br/> Praesent blandit odio eu enim.<br/> Pellentesque sed dui ut augue blandit sodales.<br/> Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Aliquam nibh.<br/> Mauris ac mauris sed pede pellentesque fermentum.<br/> Maecenas adipiscing ante non diam sodales hendrerit.<br/> Ut velit mauris, egestas sed, gravida nec, ornare ut, mi.<br/> Aenean ut orci vel massa suscipit pulvinar.<br/> Nulla sollicitudin.<br/> Fusce varius, ligula non tempus aliquam, nunc turpis ullamcorper nibh, in tempus sapien eros vitae ligula.<br/> Pellentesque rhoncus nunc et augue.<br/> Integer id felis.<br/> Curabitur aliquet pellentesque diam.<br/> Integer quis metus vitae elit lobortis egestas.<br/> Lorem ipsum dolor sit amet, consectetuer adipiscing elit.<br/> Morbi vel erat non mauris convallis vehicula.<br/> Nulla et sapien.<br/> Integer tortor tellus, aliquam faucibus, convallis id, congue eu, quam.<br/> Mauris ullamcorper felis vitae erat.<br/> Proin feugiat, augue non elementum posuere, metus purus iaculis lectus, et tristique ligula justo vitae magna.<br/> Aliquam convallis sollicitudin purus.<br/> Praesent aliquam, enim at fermentum mollis, ligula massa adipiscing nisl, ac euismod nibh nisl eu lectus.<br/> Fusce vulputate sem at sapien.<br/> Vivamus leo.<br/> Aliquam euismod libero eu enim.<br/> Nulla nec felis sed leo placerat imperdiet.<br/> Aenean suscipit nulla in justo.<br/> Suspendisse cursus rutrum augue.<br/> Nulla tincidunt tincidunt mi.<br/> Curabitur iaculis, lorem vel rhoncus faucibus, felis magna fermentum augue, et ultricies lacus lorem varius purus.<br/> Curabitur eu amet.<br/>
</p>
<h2>My little text #2</h2>
<p>
Lorem ipsum dolor sit amet, consectetuer adipiscing elit.<br/> Sed non risus.<br/> Suspendisse lectus tortor, dignissim sit amet, adipiscing nec, ultricies sed, dolor.<br/> Cras elementum ultrices diam.<br/> Maecenas ligula massa, varius a, semper congue, euismod non, mi.<br/> Proin porttitor, orci nec nonummy molestie, enim est eleifend mi, non fermentum diam nisl sit amet erat.<br/> Duis semper.<br/> Duis arcu massa, scelerisque vitae, consequat in, pretium a, enim.<br/> Pellentesque congue.<br/> Ut in risus volutpat libero pharetra tempor.<br/> Cras vestibulum bibendum augue.<br/> Praesent egestas leo in pede.<br/> Praesent blandit odio eu enim.<br/> Pellentesque sed dui ut augue blandit sodales.<br/> Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Aliquam nibh.<br/> Mauris ac mauris sed pede pellentesque fermentum.<br/> Maecenas adipiscing ante non diam sodales hendrerit.<br/> Ut velit mauris, egestas sed, gravida nec, ornare ut, mi.<br/> Aenean ut orci vel massa suscipit pulvinar.<br/> Nulla sollicitudin.<br/> Fusce varius, ligula non tempus aliquam, nunc turpis ullamcorper nibh, in tempus sapien eros vitae ligula.<br/> Pellentesque rhoncus nunc et augue.<br/> Integer id felis.<br/> Curabitur aliquet pellentesque diam.<br/> Integer quis metus vitae elit lobortis egestas.<br/> Lorem ipsum dolor sit amet, consectetuer adipiscing elit.<br/> Morbi vel erat non mauris convallis vehicula.<br/> Nulla et sapien.<br/> Integer tortor tellus, aliquam faucibus, convallis id, congue eu, quam.<br/> Mauris ullamcorper felis vitae erat.<br/> Proin feugiat, augue non elementum posuere, metus purus iaculis lectus, et tristique ligula justo vitae magna.<br/> Aliquam convallis sollicitudin purus.<br/> Praesent aliquam, enim at fermentum mollis, ligula massa adipiscing nisl, ac euismod nibh nisl eu lectus.<br/> Fusce vulputate sem at sapien.<br/> Vivamus leo.<br/> Aliquam euismod libero eu enim.<br/> Nulla nec felis sed leo placerat imperdiet.<br/> Aenean suscipit nulla in justo.<br/> Suspendisse cursus rutrum augue.<br/> Nulla tincidunt tincidunt mi.<br/> Curabitur iaculis, lorem vel rhoncus faucibus, felis magna fermentum augue, et ultricies lacus lorem varius purus.<br/> Curabitur eu amet.<br/>
</p>
<p id="extender">This is the end of the document</p>
<p>This text is after document's end</p>
</body>
</html>