jQuery columnizeList

list を table のように表示

• 【実行】 columnizeList()
• 【解除】 uncolumnizeList()

1. harold (3550)
2. horatio (1320)
3. hitler (1120)
4. henry (784)
5. hector (358)
6. haploid (315)
7. hopping (50)
8. herbert mulroney (44)
9. hopscotching (29)
10. hominibus (19)
11. honkey (19)
12. hermoine (18)
13. hieronymus (13)
14. halliburton (12)
15. hummer (10)
16. harlod (10)
17. heironymious (9)
18. hemorrhoids (7)
19. hammersack (6)

$(function () {
    $('#on').click(function () {
        $('#ex').removeClass('floated'); 
        $('#ex').columnizeList(); 
        return false; 
    });
    $('#off').click(function () {
        $('#ex').removeClass('floated');
        $('#ex').uncolumnizeList();
        return false; 
    }); 
    $('#on').click();

    //ex.
    $('#ex').columnizeList({cols:3,width:13,unit:'em'});  
});

<ol id="ex">
    <li>harold (3550)</li>
    <li>horatio (1320)</li>
</ol>

Links