Отключение структуры таблицы

Question

У меня есть комплексное веб-приложение с использованием множества вложенных таблиц. Это приложение прекрасно работает для настольной версии/просмотра.

Я собираюсь настроить его для мобильного просмотра. Что почти сделано, НО:

Я использую JSP и java, чтобы, например, получить результаты поиска. Все они отображаются в одной строке за раз. Я не могу сделать этот ряд подходящим для мобильного экрана, поэтому я ищу функцию JavaScript, чтобы отключить структурирующий стол, и просто показывать столбцы под друг другом, например. - сопоставим с оперным мини-MOBILE VIEW, который одним нажатием кнопки делает contect подходящим для любого размера экрана. Мое веб-приложение прекрасно работает, за исключением некоторых таблиц, таких как результаты поиска. Я не хочу менять JSP, а не создавать новые страницы - это будет слишком много работать!

Все, что я хочу, это включить определенный файл JavaScript, если подключенный пользователь приходит через карманное устройство (которое работает) и отключает таблицы или делает его подходящим для экрана !!

Надеюсь, что кто-то может придумать решение, я пробовал все с помощью CSS и несколько битов JavaScript (с которыми я не знаком) У меня есть два отдельных файла CSS, в зависимости от среды u conenct с, он выбирает правильный.

НО КАК ПОЛУЧИТЬ ПОЛУЧЕНИЕ ТАБЛИЦЫ/что данные будут отображаться в порядке, без необходимости прокручивать влево и вправо на маленьком устройстве, которое, как вам известно, очень раздражает;)!?!?!?

С наилучшими пожеланиями ALEX

Answer 1

Попробуйте использовать альтернативные стили:

tr{display:block;} 
td{display:inline-block;} 

... это должно позволить клетки плавать внутри их родительской строки.

Пример: http://jsfiddle.net/doktormolle/nu62m/