遇到的问题

1.自定义滑动条

由于chrome浏览器的滑动条比较丑，于是想自定义一个滑动条，上网查了一下后发现不同的浏览器都在不同程度上支持自定义滑动条，其中以chrome最为完善。下面是部分属性：

• ::-webkit-scrollbar        滚动条整体部分，其中的属性有width,height,background,border（就和一个块级元素一样）等。
• ::-webkit-scrollbar-button      滚动条两端的按钮。可以用display:none让其不显示，也可以添加背景图片，颜色改变显示效果。
• ::-webkit-scrollbar-track         外层轨道。可以用display:none让其不显示，也可以添加背景图片，颜色改变显示效果。
• ::-webkit-scrollbar-track-piece        内层轨道，滚动条中间部分（除去）。
• ::-webkit-scrollbar-thumb               滚动条里面可以拖动的那部分
• ::-webkit-scrollbar-corner               边角
• ::-webkit-resizer                       定义右下角拖动块的样式

1. 收获
   

2. 1.学会了自定义滑动条。

编程风格

圆括号

圆括号（parentheses）在JavaScript中有两种作用，一种表示函数的调用，另一种表示表达式的组合（grouping）。
我们可以用空格，区分这两种不同的括号。函数定义或者函数调用时，中间不留空白，表达式的组合时，前面位置的语法元素与左括号之间，都有一个空格。

全局变量

JavaScript最大的语法缺点，可能就是全局变量对于任何一个代码块，都是可读可写。这对代码的模块化和重复使用，非常不利。
因此，避免使用全局变量。如果不得不使用，用大写字母表示变量名，比如UPPER_CASE。

变量声明

JavaScript会自动将变量声明”提升”（hoist）到代码块（block）的头部。为了避免可能出现的问题，最好把变量声明都放在代码块的头部。另外，所有函数都应该在使用之前定义，函数内部的变量声明，都应该放在函数的头部。

new命令

JavaScript使用new命令，从构造函数生成一个新对象。上面这种做法的问题是，一旦你忘了加上new，myObject()内部的this关键字就会指向全局对象，导致所有绑定在this上面的变量，都变成全局变量。因此，建议使用Object.create()命令，替代new命令。如果不得不使用new，为了防止出错，最好在视觉上把构造函数与其他函数区分开来。比如，构造函数的函数名，采用首字母大写（InitialCap），其他函数名一律首字母小写。

switch…case结构

switch...case结构要求，在每一个case的最后一行必须是break语句，否则会接着运行下一个case。这样不仅容易忘记，还会造成代码的冗长。
而且，switch...case不使用大括号，不利于代码形式的统一。此外，这种结构类似于goto语句，容易造成程序流程的混乱，使得代码结构混乱不堪，不符合面向对象编程的原则。建议采用对象结构。