思洋互动网站建设学前班

【应用技巧】

在仿Apple滑动条产品展示效果中，可以看到MaxValue设成了内容容器的scrollWidth和clientWidth之差：

1. MaxValue: $("idContent").scrollWidth - $("idContent").clientWidth,  

其实这个值就是内容容器scrollLeft的最大值，这样在滑动时要设置的内容容器的scrollLeft刚好就是GetValue方法的值了（预览效果2也一样）：

1. onMove: function(){ $("idContent").scrollLeft = this.GetValue(); }  

预览效果2中，滑块的高度也特别设置过：

1. $("idBar2").style.height = $("idSlider2").clientHeight * Math.min($("idContent2").clientHeight / $("idContent2").scrollHeight, 1) - 4 + "px";  

其实就是使内容跟内容容器的高度之比等于滑块跟滑动容器之比，当然这个比不能大于1，否则就滑块高度就超过容器高度了，里面的4是边框宽度。

这样的好处是滑块会根据实际内容自动设置大小，就像一般的滚动条，内容越多滚动条就越小，反之就越大，这利于用户体验。
广州网站建设,网站建设,广州网页设计,广州网站设计

ps：仿Apple那个为了突出效果所以没有设置，实际应用中也应该这样设置一下。

预览效果3中，从GetValue和GetPercent取得的数有可能是很长的小数，所以显示时必须处理一下。

这里看到程序中parseInt使用了两个参数，而且第二个参数是10，是不是多余的呢？

不是的，因为手册上说了：如果没有提供，则前缀为 '0x' 的字符串被当作十六进制，前缀为 '0' 的字符串被当作八进制。所有其它字符串都被当作是十进制的。而对于手动输入的数字，前面加了个0也是很普通的情况，这样无意间就会变成八进制了。