12:22
:59
2015
Nice Scroll
- Resume:
Nice scrollbar for browser on PC and on Smartphones.
- Version:
1.3.1
- Size:
8kb
- License:
MIT License
- Copyrights:
Renan Lavarec
I needed a scrolling library for this personal website, and because I couldn't find a good one fitting all my needs, I just create my own :)
- Infos:
• Get bigger when the mouse is next to it.
• Scrollbar which is working on Smartphone.
• Automatic adaptive scrolling even if content will appear later.
• You can use a mouse on PC to move the scrollbar.
• You can click inside the scrollbar to move quickly top or down.
• You can use the scrolling button of the mouse to scroll content.
• You can use scrolling content inside scrolling content.
• Pixel perfect.
• Support browser zooming.
• Add "force scrolling" by scrolling more on extrem position (top or bottom) when 1 scroll element is child of another one. (option) (enable by default)
- Dependencies:
- jquery
- jquery.mousewheel
- underscore
- How to use it:
- html
You need 2 div, the parent will own the scrollbar, the child will be scrolled.
1
2
3
<div id="divNiceScrollSampleParent">
<div id="divNiceScrollSampleInside"></div>
</div>
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX

- CSS
"padding-right" enable to get some space when the scrollbar grow.
"padding" enable to get some space for the text scrolled.

1
2
3
4
5
6
7
8
9
#divNiceScrollSampleParent {
padding-right:10px;
height:152px;
width:580px;
}
#divNiceScrollSampleInside {
padding:5px;
}
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX

- Javascript

1
2
3
4
var niceScroll = new TR.NiceScroll("#divNiceScrollSampleInside");
niceScroll.Add();
// After you use it, you can remove remove it
niceScroll.Remove();
XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX

- Sample:
Inter haec Orfitus praefecti potestate regebat urbem aeternam ultra modum delatae dignitatis sese efferens insolenter, vir quidem prudens et forensium negotiorum oppido gnarus, sed splendore liberalium doctrinarum minus quam nobilem decuerat institutus, quo administrante seditiones sunt concitatae graves ob inopiam vini: huius avidis usibus vulgus intentum ad motus asperos excitatur et crebros.Nec vox accusatoris ulla licet subditicii in his malorum quaerebatur acervis ut saltem specie tenus crimina praescriptis legum committerentur, quod aliquotiens fecere principes saevi: sed quicquid Caesaris implacabilitati sedisset, id velut fas iusque perpensum confestim urgebatur impleri.Nihil morati post haec militares avidi saepe turbarum adorti sunt Montium primum, qui divertebat in proximo, levi corpore senem atque morbosum, et hirsutis resticulis cruribus eius innexis divaricaturn sine spiramento ullo ad usque praetorium traxere praefecti.Exsistit autem hoc loco quaedam quaestio subdifficilis, num quando amici novi, digni amicitia, veteribus sint anteponendi, ut equis vetulis teneros anteponere solemus. Indigna homine dubitatio! Non enim debent esse amicitiarum sicut aliarum rerum satietates; veterrima quaeque, ut ea vina, quae vetustatem ferunt, esse debet suavissima; verumque illud est, quod dicitur, multos modios salis simul edendos esse, ut amicitiae munus expletum sit.Adolescebat autem obstinatum propositum erga haec et similia multa scrutanda, stimulos admovente regina, quae abrupte mariti fortunas trudebat in exitium praeceps, cum eum potius lenitate feminea ad veritatis humanitatisque viam reducere utilia suadendo deberet, ut in Gordianorum actibus factitasse Maximini truculenti illius imperatoris rettulimus coniugem.
- Change log:
- Version 1.3.1
* Bug fix on options.
* Update scrollbar on parent resize.

- Version 1.3.0
* Add/Remove events binding with namespace.
* Add a grandparent node automatically.
* Enable to force scrolling by scrolling more on extreme position (top or bottom) when 1 scroll element is child of another one. (enable by default)
* Add options:
* Set the size of the minimum inner size height.
* Activate force scrolling.
* Set force scrolling attempt before to continue to scroll over the screen.

- Version 1.2.0
* Fix a bug where too much content to scroll make the cursor too small.
* Fix a bug on placement for some cases.
* Add namespace for global vars

- Version 1.1.0
* Insert scrollbar before parent of the div because of a Firefox Bug (the scrollbar absolute position was moving on scrolling content)

- Version 1.0.0
* Release the lib