重新排序陣列的CSS多列布局

Question

如何可以重新排列的陣列

[1, 2, 3, 4, 5, 6, 7, 8, 9] 

成..

[1, 4, 7, 2, 5, 8, 3, 6, 9] 

我需要它有3列的CSS佈局：

<ul> 
    <li>1</li> 
    <li>4</li> 
    <li>7</li> 
    <li>2</li> 
    <li>5</li> 
    <li>8</li> 
    <li>3</li> 
    <li>6</li> 
    <li>9</li> 
</ul> 


ul { -webkit-column-count: 3 } 

這應該會產生：

| 1 | 2 | 3 | 
| 4 | 5 | 6 | 
| 7 | 8 | 9 | 

Answer 1

ary = (1..9).to_a 
ary.each_slice(3).to_a.transpose.flatten 

Answer 2

slices = [1, 2, 3, 4, 5, 6, 7, 8, 9].each_slice(3).to_a 
zip = slices[0].zip(*slices[1..-1]).flatten 
#=> [1, 4, 7, 2, 5, 8, 3, 6, 9]