Отображать скрытую табличную ячейку на щелчке другой ячейки таблицы в HTML и CSS (расширенная версия)CSS

Разбираемся в CSS
Ответить
Anonymous
 Отображать скрытую табличную ячейку на щелчке другой ячейки таблицы в HTML и CSS (расширенная версия)

Сообщение Anonymous »

(Примечание: это продолжение моего предыдущего вопроса, который можно найти здесь: отображать скрытую ячейку таблицы на щелчке другой ячейки таблицы в HTML, CSS и JavaScript)) < /p>
Поскольку я в последний раз опубликовал свой предыдущий вопрос, кажется, что я не сделал достаточно хорошей работы, чтобы объяснить себя. Один человек по ошибке думал, что я пытаюсь создать клона -миноворота (я не), а другой не был уверен, как именно я хотел раскрыть скрытые ячейки в моем столе. Так что я здесь, чтобы, надеюсь, попробую < /strong> и исправить эту ошибку.
Итак, вот моя проблема и лучшее объяснение, которое я в настоящее время могу дать в отношении того, что я пытаюсь сделать ... < /p>
Как уже говорилось «плитки») в последовательном order.
Нажмите на раскрытую ячейку, должна изменить цвет фона к ячейке на темно -серый, а также должен показать его соседние ячейки (те, которые скрыты), изменив статус их видимости на «видимый», и изменяя цвет своих границ на белые. Заказ. И давайте предположим, что ячейка «A1» (стартовая плитка) уже раскрыта и была нажата на. что они были раскрыты). < /p>
Этот процесс следует повторять для всех ячеек, на которые нажимают игроки, у которых есть «.tile» и «.tilefinish», назначенные им. alt = "Рисунок 1" src = "https://i.sstatic.net/gwd0qtwi.png"/>
Это снимок таблицы выборки со всеми соответствующими ячеями. Только те, с соответствующими классами (".tile", ".tilestart" и т. Д.) и соответствующим идентификатором ("A2", "b3" и т. Д.) Выделены. Со всеми остальными клетками, скрытыми, кроме A1 и A2, последний из которых был выделен белой границей. Это пример ячейки, которую я хочу быть видимой и щелчок, когда игра первой загрузки. A2 заменяет свой фон цвет на темно -серый, а его соседняя ячейка «B2» раскрывается и выделяется белой границей. Если мне нужно использовать JavaScript для выполнения этой работы, то я не буду жаловаться.
Но если я смогу сделать это без < /strong> javaScript, то тем лучше. И я с нетерпением жду ответов вас.

Код: Выделить всё

body {
background-color: black;
}

table {
border-collapse: collapse;
position: absolute;
}

td {
width: 64px;
height: 64px;
text-align: center;
justify-content: center;
}

.TileStart {
border: 1px solid white;
color: black;
background-color: white;
}

.Tile {
color: white;
background-color: black;
cursor: pointer;
display: none;
}

.TileFinish {
color: black;
background-color: white;
cursor: pointer;
display: none;
}

#A2, #B2 {
display: table-cell;
}

#A2 {
border: 1px solid darkgray;
}

#B2 {
border: 1px solid white;
}< /code>



Hidden Tiles Advanced Test







Start






































Подробнее здесь: https://stackoverflow.com/questions/796 ... css-advanc
Ответить

Быстрый ответ

Изменение регистра текста: 
Смайлики
:) :( :oops: :roll: :wink: :muza: :clever: :sorry: :angel: :read: *x)
Ещё смайлики…
   
К этому ответу прикреплено по крайней мере одно вложение.

Если вы не хотите добавлять вложения, оставьте поля пустыми.

Максимально разрешённый размер вложения: 15 МБ.

Вернуться в «CSS»