blob: 955e188da654689d15dbf61df50670ea92684f0d (
plain)
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
|
// JavaScript Document
var scrollbar = new Control.ScrollBar('scrollbar_content','messagePane');
$('scroll_down_50').observe('click',function(event){
scrollbar.scrollBy(-50);
event.stop();
});
$('scroll_up_50').observe('click',function(event){
scrollbar.scrollBy(50);
event.stop();
});
$('scroll_top').observe('click',function(event){
scrollbar.scrollTo('top');
event.stop();
});
$('scroll_bottom').observe('click',function(event){
//to animate a scroll operation you can pass true
//or a callback that will be called when scrolling is complete
scrollbar.scrollTo('bottom',function(){
if(typeof(console) != "undefined")
console.log('Finished scrolling to bottom.');
});
event.stop();
});
$('scroll_second').observe('click',function(event){
//you can pass a number or element to scroll to
//if you pass an element, it will be centered, unless it is
//near the bottom of the container
scrollbar.scrollTo($('second_subhead'));
event.stop();
});
$('scroll_third').observe('click',function(event){
//passing true will animate the scroll
scrollbar.scrollTo($('third_subhead'),true);
event.stop();
});
$('scroll_insert').observe('click',function(event){
$('scrollbar_content').insert('<p><b>Inserted: ' + $('repeat').innerHTML + '</b></p>');
//you only need to call this if ajax or dom operations modify the layout
//this is automatically called when the window resizes
scrollbar.recalculateLayout();
event.stop();
});
|