0

有没有人知道随着屏幕宽度的增加/减少在不断变化的列数上显示输入的好方法？比如说，我有 15 个人。如果你的屏幕是 1200 像素宽，我想给你 15 个人，分成 3 列，每列 5 人。如果您的屏幕宽度在 800 到 1200 像素之间，那么我想给您 2 列 7 和 8 列，以及小于 800 像素的任何内容，我只会给您一个包含 15 个人的列表。

我正在寻找 jQuery 或 angularJS 解决方案。

4

2 回答 2

0

我一般不会用 angularjs 或 javascript 来做这件事，因为听 resize-event 的成本很高。为什么不使用 css-media 查询？

@media(min-width: 1200px){
   td:nth-child(13+n){
     display: none;
   } 
   tr:nth-child(4+n){
     display: none;
   } 
}
@media(min-width: 800ox){
   td:nth-child(8+n){
     display: none;
   } 
   tr:nth-child(3+n){
     display: none;
   } 
}

如果你真的想，你可以使用这样的东西：http: //jsfiddle.net/GpLHZ/

尽管链接到处理数据的特定控制器的指令或表的指令可能是更好的方法。

于 2013-11-12T00:18:20.773 回答
0

可以将 CSS3columns属性与媒体查询结合使用来更改它们

于 2013-11-12T00:19:18.283 回答