Скрываем/Показываем по клику блок с текстом – JS

Обновлено: 23 декабря, 2021

Для скрытия и отображения текста по клику по ссылке необходимо прописать следующий скрипт:

<script>
  window.onload= function() 
  {
     document.getElementById('toggler').onclick = function() 
     {
        openbox('box', this);
	return false;
     };
  };
  function openbox(id, toggler) 
  {
     var div = document.getElementById(id);
     if(div.style.display == 'block') 
     {
	div.style.display = 'none';
	toggler.innerHTML = 'Показать все вопросы';
     }
     else 
     {
	div.style.display = 'block';
	toggler.innerHTML = 'Закрыть все вопросы';
     }
  }
</script>

И в нужном месте выводим скрытый блок с текстом:

<div style="margin-bottom:20px;">
  <a id="toggler" href="#">Показать все вопросы</a>
</div>
<div class="col-md-12 col-sm-12" id="box" style="display: none;">СКРЫТЫЙ ТЕКСТ</div>

Демо данного примера можно посмотреть и скачать здесь.

Рейтинг автора
Автор статьи
Юрий
SEO-аналитик, программист (PHP, Ajax, Delphi, MySQL).
Написано статей
268
7 оценок, среднее: 5,00 из 57 оценок, среднее: 5,00 из 57 оценок, среднее: 5,00 из 57 оценок, среднее: 5,00 из 57 оценок, среднее: 5,00 из 5 (7 оценок, среднее: 5,00 из 5)
Для того чтобы оценить запись, вы должны быть зарегистрированным пользователем сайта.
Загрузка...
Понравилась статья? Поделиться с друзьями:
Блог Программиста
Добавить комментарий

2 × 1 =