Compatible with Firefox and Google
$ (". Dd"). jscroll ({W: "12px" // set the scroll bar width
, Bgurl: "" // sets the background image address of the scroll bar.
, BG: "# CCC" // sets the position and color of the scroll bar background image.
, Bar: {pos: "bottom" // set the initialization position of the scroll bar to the bottom.
, BD: {out: "#000", hover: "red"} // set the scroll axis border color: move the mouse (default), after
, BG: {out: "green", hover: "# fff", focus: "orange" }}// set the scroll bar Background: move the mouse away (default), pass by, and click
, BTN: {BTN: True // whether to display the upper and lower buttons; false: Not Displayed
, Ubg: {out: "black", hover: "# fff", focus: "orange"} // set the upper button Background: move the mouse away (default), pass by, and click
, Dbg: {out: "black", hover: "# fff", focus: "orange" }}// set the background of the button: move the mouse away (default). After that, click
, FN: function () {}// method triggered during scrolling
});
<SCRIPT type = "text/JavaScript">
$ (Document). Ready (function (){
$ (". FF"). jscroll ({
W: "15px"
, Bgurl: "URL (/demo/img/s_bg2.gif )"
, BG: "right 0 repeat-y"
, Bar: {pos: "bottom"
, BD: {out: "# a3c3d5", hover: "# b7d5e6 "}
, BG: {out: "-45px 0 repeat-y", hover: "-58px 0 repeat-y", focus: "-71px 0 repeat-y "}}
, BTN: {BTN: True
, Ubg: {out: "0 0", hover: "-15 p x 0", focus: "-30 p x 0 "}
, Dbg: {out: "0-15px", hover: "-15px-15px", focus: "-30px-15px "}}
, FN: function (){}
});
});
</SCRIPT>
<SCRIPT type = "text/JavaScript">
$ (Document). Ready (function (){
$ (". FF"). jscroll ({
W: "15px"
, Bgurl: "URL (/demo/img/s_bg3.gif )"
, BG: "right 0 repeat-y"
, Bar: {pos: "bottom"
, BD: {out: "# a3c3d5", hover: "# b7d5e6 "}
, BG: {out: "-45px 0 repeat-y", hover: "-58px 0 repeat-y", focus: "-71px 0 repeat-y "}}
, BTN: {BTN: True
, Ubg: {out: "0 0", hover: "-15 p x 0", focus: "-30 p x 0 "}
, Dbg: {out: "0-15px", hover: "-15px-15px", focus: "-30px-15px "}}
, FN: function (){}
});
});
</SCRIPT>
Customize the scroll bar style