При создании страничек сайта зачастую есть такие блоки, которые загружаясь несут всего-лишь дополнительную, но не обязательную информацию. В этом случае пользователю после их просмотра бывает удобно их закрыть, чтобы ознакомиться с другим содержимым сайта, то есть чтобы они не мешали.
 Однако по умолчанию в блоках div нет такой опции, это значит, что если вы хотите реализовать что-то подобное, придется добавить простенький код, о котором и поведаю в этой статье.

Итак, смотрите пример такого блока, он даже не оформлен, то есть нет ни рамки, ни каких либо стилей, он простое есть!

При этом вот этот текст, который вы читаете, он прописан внутри блока. Если вы хотите его выключить, то нажимаем на крестик и текст вместе с блоком пропадает. Вот такой вот наглядный пример. Попробуйте нажмите - Х

 

Все осталось сказать, что код работает за счет стандартных скриптов в браузере и привести его код для просмотра и ознакомления.

Смотреть код

Также при необходимости оформления крестика правим его стили в CSS для class="close".