Permalink
Dec 12, 2014
Dec 12, 2014
Dec 12, 2014
Dec 12, 2014
Newer
100644
78 lines (57 sloc)
1.94 KB
1
Scrolline.js
2
========================================
3
4
A jQuery plugin. Create a scroll line bar indicator on the page.
5
7
8
* [Anthonyly.com/jquery.plugins/scrolline](http://anthonyly.com/jquery.plugins/scrolline)
9
10
## Documentation
11
12
### Basic Usage
13
14
Include scrolline.js file in the page, along with jQuery.
15
16
```html
17
<script src="js/jquery.js"></script>
18
<script src="js/scrolline.js"></script>
19
```
20
21
Then call ``$.scrolline();`` to launch the plugin.
22
23
### Options
24
25
You can apply a set of optional options:
26
27
* ``backColor`` - Define the color of back's scrolline (default ``'#ecf0f1'``)
28
* ``direction`` - Can be **vertical** or **horizontal** (default ``'horizontal'``)
29
* ``frontColor`` - Define the color of front's scrolline (default ``'#2ecc71'``)
30
* ``opacity`` - Define alpha's scrolline, value must be between **0** and **1** (default ``1``)
31
* ``position`` - Define the position of scrolline : **top** and **bottom** for horizontal's position, **left** or **right** for vertical's position (default ``top`` in horizontal and ``left`` in vertical)
32
* ``reverse`` - Revert the front line sens on set value at **true** (default ``false``)
33
* ``weight`` - Define the larger of scrolline on pixels (default ``5``)
34
* ``zindex`` - Change the z-index value if needed (default ``10``)
35
* ``scrollEnd`` - Callback's **function** call at the end of scrolling
36
37
### Example
38
39
Scrolline revert with custom color at bottom position:
40
41
```js
42
$.scrolline({
43
reverse : true,
44
position : 'bottom',
45
backColor : '#2980b9',
46
frontColor : '#f1c40f',
47
weight : 12
48
});
49
```
50
51
Scrolline vertical at right position with callback:
52
53
```js
54
$.scrolline({
55
position : 'right',
56
direction : 'vertical',
57
weight : 30,
58
scrollEnd : function() {
59
alert('End of scroll!');
60
}
61
});
62
```
63
64
## Compatibility
65
66
* Safari
67
* Firefox
68
* Chrome
69
* IE
70
* Safari mobile
71
72
## Credits
73
74
### Author
75
[Anthony Ly](http://anthonyly.com), on twitter [@Pik_at](http://twitter.com/pik_at)
76
77
### Licence
78
Licence MIT