Как сделать блок изначальо закрытым

243

10 декабря 2016, 10:38

$(function(){ 
  $("button").click(function () { 
      $("div").slideToggle("slow"); 
    }); 
  });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
<button>Вуаля!</button><br><br> 
<div> 
	<b>Правило.</b> Ё должна использоваться: в случаях возможных разночтений; в словарях;  
	в книгах для изучающих русский язык (т. е. детей и иностранцев); для правильного  
	прочтения редких топонимов, названий или фамилий. Во всех остальных случаях  
	наличие буквы ё только затрудняет чтение. Она плохо выглядит, зато хорошо звучит. 
</div>

Как сделать, чтобы блок был изначально закрытым?

Answer 1

Просто добавить к div-блоку стиль, в котором описать свойство display, которое определяет, как элемент должен быть показан в документе:

<div style="display: none;">

Все это можно увидеть, если посмотреть в исходный код вашего документа и увидеть как он изменяется. Пример Вашего исходного кода до нажатия:

исходный код после нажатия:

Отсюда можно сделать простой вывод, чего Вам не хватает в коде.

Answer 2

$(function(){ 
  $("button").click(function () { 
      $("div").slideToggle("slow"); 
    }); 
  });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
<button>Вуаля!</button><br><br> 
<div style="display: none;"> 
	<b>Правило.</b> Ё должна использоваться: в случаях возможных разночтений; в словарях;  
	в книгах для изучающих русский язык (т. е. детей и иностранцев); для правильного  
	прочтения редких топонимов, названий или фамилий. Во всех остальных случаях  
	наличие буквы ё только затрудняет чтение. Она плохо выглядит, зато хорошо звучит. 
</div>