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
50
|
$(document).ready(function(){
var animateTime = 1,
offsetStep = 5;
scrollWrapper = $('#wrap');
scrollContent = $('#content');
//event handling for buttons "left", "right"
$('.bttR, .bttL')
.mousedown(function() {
scrollContent.data('loop', true).loopingAnimation($(this), $(this).is('.bttR') );
})
.bind("mouseup mouseout", function(){
scrollContent.data('loop', false).stop();
});
scrollWrapper
.mousedown(function(event) {
$(this)
.data('down', true)
.data('x', event.clientX)
.data('scrollLeft', this.scrollLeft);
return false;
})
.mouseup(function (event) {
$(this).data('down', false);
})
.mousemove(function (event) {
if ($(this).data('down') == true) {
this.scrollLeft = $(this).data('scrollLeft') + $(this).data('x') - event.clientX;
}
})
.mousewheel(function (event, delta) {
this.scrollLeft -= (delta * 30);
event.preventDefault();
})
.css({
'overflow' : 'hidden',
'cursor' : '-moz-grab'
});
$.fn.loopingAnimation = function(el, dir){
if(this.data('loop')){
var sign = (dir) ? '-=' : '+=';
this.animate({ marginLeft: sign + offsetStep + 'px' }, animateTime, function(){ $(this).loopingAnimation(el,dir) });
}
return false;
};
})
|