Скрит текст (спойлер) с Javascript

Вероятно най-известният пример за използване на скрит текст са добре познатите "спойлери" в различни форуми. Скритият текст може да се направи както с jQuery, така и с чист CSS, всяка техника има както предимства, така и недостатъци. Днес искам да демонстрирам много малък javascript, с който е много лесно да „скрия под изрезката“ почти всяка информация на моя сайт.

И така, имаме някакъв текст, трябва да подчертаем или една дума, термин или цяла фраза и да ги направим кликващи. За да направите това, достатъчно е да „оградите“ думата (фраза), от която се нуждаем, с етикета, както в примера, или с връзка, използваща маркера. Много хора използват маркера по-често, тук както курсорът е регистриран, така и изборът по подразбиране, но мисля така, защо се нуждаем от връзки, които не водят никъде, но можете лесно да „нарисувате“ курсора и да изберете всеки елемент с помощта на css. Така че, вътре в текста, можете да използвате:

текст текст текст

За скрит текст можете да използвате div-контейнер или, както в примера, същия таг, основното е да го свържете с клас с css и не забравяйте да посочите правилно идентификатора:

Тук можете да поставите произволен текст или можете да го разредите с картина.

Както споменах по-горе, за да стартирате нашия „спойлер“, отваряне и скриване при щракване, имате нужда от малък javascript, поставен директно в основния текст на страницата, за предпочитане преди маркера