有懂iosSlider.js的吗帮忙看看一个我正在编写的页面

V2EX = way to explore

V2EX 是一个关于分享和探索的地方

现在注册

已注册用户请登录

这是一个创建于 4553 天前的主题，其中的信息可能已经有所发展或是发生改变。

问题页面 http://www.fk68.net/0/
这个用html5做的页面请用高级一点的浏览器至少IE7以上来浏览(页会会根据浏览器宽度自适应变化)。

请不要在意右侧那堆按扭，我还没去做那块。
你点一下 [支出] 里的 [取消] 按扭可以暂时把这个表单框收起来。

你现在能看到一个日期横向列表，往左是小往右是大。
那个滚动日期我用的是iosSlider，页面初始时应该是停在往右的最后一个月份（有阴影也就是当前月）
打个比方当，我三年前8月记了一笔帐，现在打开就显示三年前第一次加数据的月份8月开始的日期列表，这样很不人性化。
如果把这日期滚动条改为左大右是小，这样就不太符合用户体验，一般往左是过去，往右是未来。

jquery.iosslider里虽然有startAtSlide这个开始幻灯片参数，但这个数值在Short Slide Width短幻灯片宽度时不能填最后一个，
而只能填能显示的开始位置最大的那个，如果你的短幻灯片一页能显示5个，你有15个幻灯片的话startAtSlide不能等于15，而只能等于10.
同样goToSlide方法也只能是用10，否则就不会进行后翻的动作。

说这么多其实我就想加载页面后iosSlider自动初始化到最后一个月份按扭。
有懂iosSlider能帮我解决下吗，或是改下iosSlider的代码，我JS不是太熟悉。谢谢了。

iosSlider http://iosscripts.com/iosslider-jquery-horizontal-slider-for-iphone-ipad-safari/

iosSlider

页面

幻灯片

5 条回复 • 1970-01-01 08:00:00 +08:00

fanzeyi

2012-06-09 18:29:35 +08:00

没接触过 iosSlider 以下方法只是随便说说.. 我觉得计算一下 startAtSlide 不就好了嘛...

貌似主要问题在页面是动态的.. 显示的月份数目不是固定的可以尝试取宽度计算下... = =

fanzeyi

2012-06-09 18:31:45 +08:00

或者另外一个思路..如果我一共有15个一页显示5个然后给 startAtSlide 赋了 13 .. 这时候如果是显示没变化而不是显示到第一页的话

可以考虑在页面加载后从 1 ~ n 依次赋给 startAtSlide ... 具体实现肯定不应该是赋值... 只是想法而已想法= =

feikeq

2012-06-10 10:54:40 +08:00

@fanzeyi 你有没有发现我的月份中间还有一个年份的竖线，就因为添加了年份的区别，把以使幻灯片由Short Slide Width固定短幻灯片宽度变成了Variable Slide Width不定长宽度幻灯片...所以在计算上就添加了不少麻烦...我觉得应该有更简单的方法能让iosSlider滑到最后一页...

1 ~ n 依次赋给 startAtSlide ... 意是从1~n次都做一次goToSlide滑动？

fanzeyi

2012-06-10 11:57:12 +08:00

@feikeq 差不多就是这个意思... 当然必须在越界的时候不会给滚动到最左的时候才能用 = =..

feikeq

2012-06-10 14:12:48 +08:00

@fanzeyi 谢谢你，我今天花一上午时间把iosSlider的JS代码看了一遍，找到办法了。

顺藤摸瓜

var endOffset = childrenOffsets[slide]; /这就是滚动位置/
最大值：data.childrenOffsets[data.childrenOffsets.length-1]

废客提出解决办法：
找到changeSlide: function方法里的这一行：
var endOffset = childrenOffsets[slide];
在其下添加代码：
if(!Boolean(endOffset)){endOffset=childrenOffsets[childrenOffsets.length-1];}
即可。

iosslider.min.js小文件找到
,t=h[j]-q,r=[],
这一段在其后加入：
;if(!Boolean(h[j]))h[j]=h[h.length-1]; var t=h[j]-q,r=[],
即可!

这样你就可以用 $('.iosSlider').iosSlider('goToSlide', 999999);来移动到最后一页啦。