#javascript #html #jquery #css #html-table
#javascript #HTML #jquery #css #html-таблица
Вопрос:
У меня есть HTML-таблица примерно с 12 ячейками. Но на мобильном экране в данный момент видны только 4, и вам нужно прокручивать по горизонтали, чтобы просмотреть остальную часть ячейки. Каждая ячейка является ссылкой на другую страницу, и на каждой странице есть одна и та же таблица. Я хочу, чтобы всякий раз, когда мы нажимаем на любую ячейку, эта ячейка должна становиться активной / выделенной при переходе на связанную с ней страницу и быть видимой на экране, даже если она находится в крайнем правом углу.
Ответ №1:
Для мобильных устройств я бы рассмотрел возможность применения блока отображения ко всем таблицам, строкам и ячейкам. Таким образом, она длинная, вертикальная, но легко просматриваемая. Плюс прокрутка вертикальная, что намного проще.
Что касается ваших ссылок, это скорее проблема на стороне сервера: вы должны передать параметр, соответствующий выбранной ячейке (скажем, r2c4) в вашем URL (mypage.php?cell=r2c4), и применить стиль к соответствующей ячейке на вашей отображаемой странице с помощью простого класса, например .ActiveCell.
Комментарии:
1. оформление работает отлично, но если ячейка находится в крайнем правом углу, то это видно только при горизонтальной прокрутке, я хочу, чтобы она автоматически прокручивалась до этой ячейки. Также я хочу только горизонтальную таблицу.
2. Если вы используете вертикальную прокрутку, вам просто нужно поместить идентификатор в ячейку и использовать ее привязку.
Ответ №2:
Итак, я нашел ответ на этот вопрос, мы можем просто присвоить некоторый идентификатор ячейке, которую мы хотим отобразить на экране, и по ссылке мы передаем идентификатор этой ячейки, которую мы хотим сохранить активной и видимой на экране.