如何在移动设备上处理宽表

Str*_*_99 6 css ajax mobile jquery jquery-mobile

这里有一般性问题.只是想知道在移动设备上是否有一个聪明的显示宽表(IE.很多列).

为了解释一下,我们创建了使用主站点中的ajax加载内容的移动站点,在某些情况下,这些页面容器表具有很多列.将整个桌子安装到垂直移动设备上的唯一方法是缩小字体大小直到它不可读.

只是想知道那里是否还有其他选择.

谢谢.

97l*_*ave 5

您可以为每一行使用"小部件",而不是使用表来显示数据.这使得设计移动设备变得更加容易,并使数据以响应方式流动.

示例:Examdoctor - 立即购买页面


Gaj*_*res 2

如果您愿意冒险,jQuery Mobile 的 beta 版本(如果这个问题与之相关)有一个新的响应式表实现:

http://jquerymobile.com/demos/1.3.0-beta.1/docs/tables/index.html

这是一个示例:http://jquerymobile.com/demos/1.3.0-beta.1/docs/tables/table-reflow.html

基本上,如果屏幕宽度变窄,它会改变其大小以适应宽度变化。您可以以这样的方式使用它:如果宽度太小,一些预定义的列将隐藏。目前,这是 jQuery Mobile 框架上响应式表格的最佳解决方案。