darsain / sly

JavaScript library for one-directional scrolling with item based navigation support.
http://darsa.in/sly
2.87k stars 497 forks source link

Slidee width calculation #209

Closed jls2933 closed 8 years ago

jls2933 commented 9 years ago

I have noticed a problem when using a horizontal item-based slidee, containing items with natural size.

Each of my items is inline-block, with nowrap white space, and then the size of each items is function of the length of the string displayed, which becomes decimal pixel width under some browsers like Firefox. The last item is then invisible because the slidee calculated width is lesser than it should be. It's because each item width is rounded before it is used in the sum calculation.

When i comment the round function (line 217), the bug disappears : var itemSize = /round(/o.horizontal ? rect.width || rect.right - rect.left : rect.height || rect.bottom - rect.top/)/;

Is there a good reason item widths have been rounded ?

darsain commented 9 years ago

I'm afraid Sly won't work with inline-block items. There is nothing to account for white space, so slidee width will always be too small.

As far as rounding goes, I'm sure there is a reason for it, but I can't recall right now :)

There has been (and apparently still are) a lot of issues with getting item sizes due to inconsistencies in browsers' rounding. I thought I had it solved in one of the last few versions which reworked the item dimension retrieval, but apparently not. There is already #200 that says there is still some issue with it, and I haven't had a time, nor motivation to look into it yet :/

jls2933 commented 9 years ago

Thank you for your reply. I will do some extra tests and if i got some more information that could help you or find a workaround, i will report it here.

darsain commented 8 years ago

Closing this in favor of #200. If you have new info or fiddles post them there.