思洋互动网站建设学前班

【百分比和值】

这个是基本功能了，先看看GetPercent获取百分比程序，这个百分比就是滑块左边距离跟滑动区域的比例：

1. return this._horizontal ? this.Bar.offsetLeft / (this.Container.clientWidth - this.Bar.offsetWidth)  
2.         : this.Bar.offsetTop / (this.Container.clientHeight - this.Bar.offsetHeight)  

注意滑动区域是容器的clientWidth减去滑块的offsetWidth（关于这两个属性详细请看这里）。

对应的有SetPercent设置百分比位置程序，就是根据百分比参数设置滑块的位置：

1. this.EasePos((this.Container.clientWidth - this.Bar.offsetWidth) * value, (this.Container.clientHeight - this.Bar.offsetHeight) * value); 

滑动条更多的应用是在于值的运用。程序中属性MinValue和MaxValue分别设置最小值和最大值。

ps：虽然说是最大值，但不一定就比较大的，不过这样写起来比较方便。
广州网站建设,网站建设,广州网页设计,广州网站设计

当设置了这两个属性（值）就能GetValue获取当前值了：

1. return this.MinValue + this.GetPercent() * (this.MaxValue - this.MinValue);  

对应的SetValue设置值位置程序：

1. this.SetPercent((value- this.MinValue)/(this.MaxValue - this.MinValue));  

这个很简单，懂点数学应该都明白了。

【位置状态】

程序中有位置程序onMin（最小值时）、onMax（最大值时）和onMid（中间值时）分别在各自位置时执行。

ps：onMid指的是除最小值最大值外的中间部分，不是中心值。

程序是在Move滑动程序中通过百分比来判断当前位置的（0时为最小值，1时为最大值，其他为中间值）。

由于Move程序并不会因为到了极限值就停止，如果仅仅根据百分比来判断那么到了极限值，值虽然不变但程序就会一直被触发。

而我需要的是当值不变的时候，对应位置程序仅仅触发一次。根据需求就衍生出三个位置状态属性_IsMin（最小值状态）、_IsMax（最大值状态）和_IsMid（中间值状态）。

用这几个状态属性和百分比就能实现需要的效果了：

1. var percent = this.GetPercent();  
2. //最小值判断  
3. if(percent > 0){  
4.     this._IsMin = false;  
5. }else{  
6.     if(!this._IsMin){ this.onMin(); this._IsMin = true; }  
7. }  
8. //最大值判断  
9. if(percent < 1){  
10.     this._IsMax = false;  
11. }else{  
12.     if(!this._IsMax){ this.onMax(); this._IsMax = true; }  
13. }  
14. //中间值判断  
15. if(percent > 0 && percent < 1){  
16.     if(!this._IsMid){ this.onMid(); this._IsMid = true; }  
17. }else{  
18.     this._IsMid = false;  
19. }  

这三个位置状态属性在其他程序中也用来判断是否到了极限值。
广州网站建设,网站建设,广州网页设计,广州网站设计