Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 07.09.2015, 20:35
Аспирант
Отправить личное сообщение для Quark_ Посмотреть профиль Найти все сообщения от Quark_
 
Регистрация: 24.06.2015
Сообщений: 96

Открыть/закрыть блок через animate
Нужна помощь. По клику - открыть блок через animate, по повторному клику - закрыть его.
Не понимаю, как это правильно сделать
$(document).ready(function(){
	$(".more").click(function(){
		$(".text_hide").css({display:'block'}).animate({opacity:'1'}, 1000)
	});
	$(".more").click(function(){
		$(".text_hide").css({display:'none'}).animate({opacity:'0'}, 500)
	});
});
Ответить с цитированием
  #2 (permalink)  
Старый 07.09.2015, 20:46
Аватар для Lemme
Профессор
Отправить личное сообщение для Lemme Посмотреть профиль Найти все сообщения от Lemme
 
Регистрация: 15.07.2015
Сообщений: 511

$(".more").click(function(){
    $(".text_hide").toggle(1000);
});

Последний раз редактировалось Lemme, 07.09.2015 в 20:57.
Ответить с цитированием
  #3 (permalink)  
Старый 07.09.2015, 20:50
Аспирант
Отправить личное сообщение для Quark_ Посмотреть профиль Найти все сообщения от Quark_
 
Регистрация: 24.06.2015
Сообщений: 96

Сообщение от Lemme Посмотреть сообщение
$(".more").click(function(){
    $(".text_hide").toggle(1000);
});
Ничего не понял) А куда animate?
Ответить с цитированием
  #4 (permalink)  
Старый 07.09.2015, 20:57
Аватар для Lemme
Профессор
Отправить личное сообщение для Lemme Посмотреть профиль Найти все сообщения от Lemme
 
Регистрация: 15.07.2015
Сообщений: 511

Так понятно?
<!DOCTYPE html>
<html lang="en">
<head>
	<style>
		.text_hide {  padding: 10px; background-color: #eee; border: 1px solid red  }
	</style>
	<script src="http://code.jquery.com/jquery-1.8.3.js"></script>
</head>
<body>
	
	<button class="more">click</button>
	<p class="text_hide">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Veniam molestias sit, error tempore consequuntur quae velit ipsa ipsum recusandae molestiae exercitationem nisi ad doloribus quia, culpa incidunt veritatis laudantium non.</p>
	<script>
		$(".more").click(function(){
		    $(".text_hide").toggle(1000);
		});
	</script>
</body>
</html>
Ответить с цитированием
  #5 (permalink)  
Старый 07.09.2015, 21:08
Аспирант
Отправить личное сообщение для Quark_ Посмотреть профиль Найти все сообщения от Quark_
 
Регистрация: 24.06.2015
Сообщений: 96

THX, все работает, но в стилях добавил
.text_hide {
display:none;
}
т.к. при загрузке страницы текст виден, хотя в вашем примере этого нет.
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Скрыть/показать блок в зависимости от radio MBmusic Элементы интерфейса 10 08.05.2013 17:23
Умный выскакивающий блок lobanov_kirill_ Общие вопросы Javascript 2 05.03.2013 00:29
Как сделать блок, исчезающий вверху страницы? TRos Элементы интерфейса 7 12.04.2012 08:59
Эмулировать список через селект Nanto Элементы интерфейса 2 06.03.2012 11:54
XMLHTTPRequest передача имя через POST dds AJAX и COMET 0 14.08.2008 14:44