Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 20.09.2012, 19:06
Новичок на форуме
Отправить личное сообщение для bfg1114 Посмотреть профиль Найти все сообщения от bfg1114
 
Регистрация: 16.09.2012
Сообщений: 5

.slideToggle
Добрый вечер.
Хочу сделать сворачивающийся/разворачивающийся блок с помощью .slideToggle.

В идеале: по клику на кнопку "Свернуть" синий блок сворачивается, а сама кнопка уезжает на зеленый блок и превращается в "Развернуть". По повторному клику на "Развернуть" выезжает синий блок, а кнопка возвращается на первоначальное место и превращается в "Свернуть".

НО

В коде, котором я написал, кнопка хоть и перемещается вверх, но сворачивается вместе с блоком.
Подскажите, пжлст, что изменить?

http://jsfiddle.net/EsxdJ/

HTML
<!DOCTYPE html>
<html>
 <head>
  <meta charset="utf-8">
  <link rel="stylesheet" type="text/css" href="styles.css">
  <script type="text/javascript" src="http://code.jquery.com/jquery-1.8.1.min.js"></script>
  <script src="js.js"></script>
 </head> 
 
<body>
	<div id="container">
	
		<div id="block1"></div>
		
		
		<div id="block2">
		<div id="button">Свернуть</div>
		</div>
		
	</div>
 </body> 
</html>


CSS
Код:
#container{
	width: 400px;
}
#block1{
	height: 100px;
	background-color:lightgreen;
}
#block2{
	height: 100px;
	background-color:lightblue;
}
JQUERY
$(function () {   

	$('#button').click(function (){ 
		$("#block2").slideToggle();
		$('#button').css('position','relative');
		$('#button').animate({bottom:'100px'}, 1000);
    }); 

});
Ответить с цитированием
  #2 (permalink)  
Старый 22.09.2012, 12:51
Аватар для Margarita
Аспирант
Отправить личное сообщение для Margarita Посмотреть профиль Найти все сообщения от Margarita
 
Регистрация: 14.09.2012
Сообщений: 83

http://jsfiddle.net/EsxdJ/6/
Ответить с цитированием
  #3 (permalink)  
Старый 22.09.2012, 13:08
Новичок на форуме
Отправить личное сообщение для bfg1114 Посмотреть профиль Найти все сообщения от bfg1114
 
Регистрация: 16.09.2012
Сообщений: 5

Margarita, я почти сам дошел до похожего решения, но все равно, спасибо вам
Ответить с цитированием
Ответ



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

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


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Разворачивание div элемента с .slideToggle() clear Элементы интерфейса 0 22.07.2011 15:49
.slidetoggle в IE и FF vaka jQuery 1 24.10.2009 03:42