Pop-up окно при нажатии на td
Доброго времени суток, уважаемые форумчане!
Прошу помощи, есть код раскрывающегося окна со стилями:
<div class="demo">
<input type="checkbox" id="hd-1" class="hide"/>
<label for="hd-1"><b>Посмотреть все решения</b></label>
<div>
<table>
<tr>
<td Транспорт</td>
<td>Ретейл</td>
<td>ТРЦ</td>
<td >Массовые мероприятия</td>
</tr>
<tr>
</table>
</ul>
</div>
</div>
<style> .hide { display: none; }
.hide + label ~ div{ display: none; }
.hide + label { border-bottom: 1px dotted green; padding: 0; color: black; cursor: pointer; display: inline-block; font-family: Roboto, Sans-Serif; }
.hide:checked + label { color: black; border-bottom: 0; }
.hide:checked + label + div { display: block; background: #efefef; padding: 10px; } .demo { margin: 1% 21%; width: 45%; }
table { font-family: "Roboto","Roboto", Sans-Serif; border-collapse: collapse; color: #686461; }
caption { padding: 10px; color: white; background: #8FD4C1; font-size: 18px; text-align: left; font-weight: bold; }
th { border-bottom: 3px solid #B9B29F; padding: 10px; text-align: left; }
td { padding-left: 45px; padding-top: 10px; color: #000000; text-decoration: none; } td:visited { color: #C0C0C0; }
td:hover { color: #000000; text-decoration: underline; } }
tr:nth-child(odd) { background: white; } tr:nth-child(even) { background: white; } </style>
Необходимо по нажатию на ссылку (ячейку таблицы), любую из выпадающего списка, открывать pop-up окно, всю голову сломал...