0 Comments

Slider实现的滑动条效果(5)

发布于:2013-07-12  |   作者:广州网站建设  |   已聚集:人围观

【样式设置】

程序没有对margin之类的样式进行处理,所以尽量使用“干净”的元素,如果用ul那些,请先“清理”好。

在仿Apple滑动条产品展示效果中,像那样横排的展示,最好是放在table里才能保证不换行,否则就要放一个很长很长的副容器来放内容。

里面还有一个样式比较特别的,细心的话可以看到滑块是突出了一个半圆,而且是刚好能嵌在两端的。

这里主要是滑块两边的两个层(两个半圆)使用了绝对定位,设置了负的位置值(左边是负的left,右边是负的right)。
广州网站建设,网站建设,广州网页设计,广州网站设计

还有就是到达两端时对应的层会自动换一个背景图,但其实是同一张图:

这里是用了变换背景图位置的方法,这个方法也不新鲜了,这里要说说的是,虽然只是换垂直方向的坐标,但backgroundPositionY只是ie的方法,所以还是要用backgroundPosition。

飞机