Javascript.RU

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

animate есть предложения?
Здравствуйте, давненько меня здесь не было ( !
Предисловие:
Сделал кнопку подробнее... При нажатии, на которую плавно раскрывается часть текста, спрятанная в ov_hidden.
Но так как высота текста перемена и animate height 100% и auto не работает, то пришлось извращаться, т.е при нажатии на кнопку script, прежде чем выполнить, то что я от него прошу сначала выполняет не видимые глазу пользователя действия, а затем плавно меняет высоту блока и показывает спрятанный текст.
Вопрос:
Есть ли другой способ без лишних scriptoдвижений?
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="content-type" content="text/html;charset=UTF-8" />
	<script src="http://code.jquery.com/jquery-1.7.2.min.js"></script>
		<style>
		.all_description{
			height: 120px;
			overflow: hidden;
			display: block;
		}
		</style>
		<script>
			$(document).ready(function() {
	$(".desc_hidden a").click(function(eventObject){
		eventObject.preventDefault();
	});
	
		$('.all_description').css({
			      "height": "100%",
			    });
		
		ALL_DESCRIPTION = $('.all_description').height();
		$('.all_description').css({
			      "height": 120,
			    });

	$(".desc_hidden a").toggle(function(){
	$('.all_description').animate({
		      "height": ALL_DESCRIPTION,
		    }, 500);
		$(".desc_hidden a").html('<a class="more" href="#">Скрыть...</a>');
	}, function(){
			$('.all_description').animate({
			      "height": 120,
			    }, 500);
			$(".desc_hidden a").html('<a class="more" href="#">Подробнее...</a>');
		});
});//Конец ready
</script>
</head>
<body>
<div class="all_description">
<h3>Описание:</h3>
<p>Единая служба экстренных вызовов (911) организована в штатах в 1968 году для быстрого реагирования и решения возникающих проблем, связанных с угрозой для жизни или здоровья. Однако большая часть звонящих обращается в службу за решением незначительных бытовых задач, отнимая возможность у реально оказавшихся в беде людей получить помощь. Это история о напряженной и ответственной работе службы спасения США, правила работы которой гласят: ничего нельзя обещать звонящему, нельзя принимать близко к сердцу его проблему, выяснив все обстоятельства и детали, записав все данные, передать дело дальше в соответствующие инстанции.</p>
					
						<p>Фильм Тревожный вызов рассказывает об операторе колл-центра службы спасения, молодой женщине по имени Джордан, которая вступила в схватку с отъявленным маньяком-убийцей, охотящимся за молодыми белокурыми девушками. Не успев спасти одну из первых жертв, Джордан винит себя в ее смерти, отстраняется от всего и не может продолжать работу в обычном режиме. По какой-то роковой случайности звонок второй жертвы тоже попадает к ней. Растерявшись в начале, в конце концов, она берет себя в руки и ...</p>

						<p>Итак, о чем мы будем смотреть фильм Тревожный вызов? На пульт службы спасения поступает тревожный звонок от юной школьницы, которая сообщает о неизвестном мужчине, проникшем в ее дом. Джордан пытается успокоить перепуганную девушку и советует ей спрятаться под кроватью. Все закончилось бы хорошо, и девушка могла остаться жить, если бы их разговор не прервался, и Джордан не попыталась бы ей перезвонить.</p>
						
</div>
<span class="desc_hidden float_right">
<a class="more" href="#">Подробнее...</a>
</span>	
				
	</body>
	</html>

Последний раз редактировалось devote, 24.04.2014 в 13:58. Причина: Пользуемся тегами [HTML run]...[/HTML]
Ответить с цитированием
  #2 (permalink)  
Старый 22.04.2014, 20:56
Аспирант
Отправить личное сообщение для Apollon Посмотреть профиль Найти все сообщения от Apollon
 
Регистрация: 01.11.2013
Сообщений: 42

Да ой 1.7 я не пользуюсь, но функцию использую (переименовав ее в oldtoggle и переправив jq). Переправил код по совету ronny.
Ответить с цитированием
  #3 (permalink)  
Старый 22.04.2014, 20:59
Аспирант
Отправить личное сообщение для Apollon Посмотреть профиль Найти все сообщения от Apollon
 
Регистрация: 01.11.2013
Сообщений: 42

Понимаю для опытных javascripеnt-теров вопрос не стоит внимания, но может кто поделится своим опытом
Ответить с цитированием
  #4 (permalink)  
Старый 22.04.2014, 21:56
Особый гость
Посмотреть профиль Найти все сообщения от monolithed
 
Регистрация: 02.04.2010
Сообщений: 4,260

Сообщение от Apollon
давненько меня здесь не было
И поэтому решил сразу написать в раздел "Сайт Javascript.ru" ?
Ответить с цитированием
  #5 (permalink)  
Старый 22.04.2014, 21:58
Аспирант
Отправить личное сообщение для Apollon Посмотреть профиль Найти все сообщения от Apollon
 
Регистрация: 01.11.2013
Сообщений: 42

Почему нет
Ответить с цитированием
  #6 (permalink)  
Старый 22.04.2014, 21:58
Аспирант
Отправить личное сообщение для Apollon Посмотреть профиль Найти все сообщения от Apollon
 
Регистрация: 01.11.2013
Сообщений: 42

Странный ты человек
Ответить с цитированием
  #7 (permalink)  
Старый 22.04.2014, 22:00
Аспирант
Отправить личное сообщение для Apollon Посмотреть профиль Найти все сообщения от Apollon
 
Регистрация: 01.11.2013
Сообщений: 42

Сообщение от monolithed Посмотреть сообщение
И поэтому решил сразу написать в раздел "Сайт Javascript.ru" ?
Гуфи, что за негатив?
Ответить с цитированием
  #8 (permalink)  
Старый 22.04.2014, 22:12
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,109

Apollon,
тему вы создали не в том разделе
<!DOCTYPE HTML>

<html>

<head>
  <title>Untitled</title>
  <meta charset="utf-8">
  <style>
		.all_description{
			height: 120px;
			overflow: hidden;
			display: block;
		}
		</style>
  <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
  <script>
   $(function ()
{
var max = $('.all_description')[0].scrollHeight , n = 1;
$('.more').click(function (event)
{
   event.preventDefault();
    n = ++n%2;
    $(this).text(n ? 'Подробнее...' : 'Скрыть...')
 	$('.all_description').animate({
		      "height": n ? 120 : max
		    }, 500);
})
})
  </script>
</head>

<body>
<div class="all_description">
<h3>Описание:</h3>
<p>Единая служба экстренных вызовов (911) организована в штатах в 1968 году для быстрого реагирования и решения возникающих проблем, связанных с угрозой для жизни или здоровья. Однако большая часть звонящих обращается в службу за решением незначительных бытовых задач, отнимая возможность у реально оказавшихся в беде людей получить помощь. Это история о напряженной и ответственной работе службы спасения США, правила работы которой гласят: ничего нельзя обещать звонящему, нельзя принимать близко к сердцу его проблему, выяснив все обстоятельства и детали, записав все данные, передать дело дальше в соответствующие инстанции.</p>

						<p>Фильм Тревожный вызов рассказывает об операторе колл-центра службы спасения, молодой женщине по имени Джордан, которая вступила в схватку с отъявленным маньяком-убийцей, охотящимся за молодыми белокурыми девушками. Не успев спасти одну из первых жертв, Джордан винит себя в ее смерти, отстраняется от всего и не может продолжать работу в обычном режиме. По какой-то роковой случайности звонок второй жертвы тоже попадает к ней. Растерявшись в начале, в конце концов, она берет себя в руки и ...</p>

						<p>Итак, о чем мы будем смотреть фильм Тревожный вызов? На пульт службы спасения поступает тревожный звонок от юной школьницы, которая сообщает о неизвестном мужчине, проникшем в ее дом. Джордан пытается успокоить перепуганную девушку и советует ей спрятаться под кроватью. Все закончилось бы хорошо, и девушка могла остаться жить, если бы их разговор не прервался, и Джордан не попыталась бы ей перезвонить.</p>

</div>
<span class="desc_hidden float_right">
<a class="more" href="#">Подробнее...</a>
</span>
</body>

</html>
Ответить с цитированием
  #9 (permalink)  
Старый 22.04.2014, 22:16
Аспирант
Отправить личное сообщение для Apollon Посмотреть профиль Найти все сообщения от Apollon
 
Регистрация: 01.11.2013
Сообщений: 42

Извиняюсь. И еще раз спасибо вам, рони
Ответить с цитированием
  #10 (permalink)  
Старый 22.04.2014, 22:31
Аспирант
Отправить личное сообщение для Apollon Посмотреть профиль Найти все сообщения от Apollon
 
Регистрация: 01.11.2013
Сообщений: 42

рони,
Извините за неуместный вопрос. JS я знаю поверхностно и до сих пор не углублялся в эту тему, но ваши решения задач меня вдохновили на более углубленное его изучение. Я понятия не имею, что означают выражения типа n = ++n%2; и n ?
Может подскажите хороший материал для изучения?
Ответить с цитированием
Ответ



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

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


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Как проверить, есть ли скроллбар shaltay Events/DOM/Window 13 11.05.2014 10:53
Выборка элементов у которых есть данные установленные через дата TicTac jQuery 2 02.05.2011 23:45
как узнать, есть ли в строке определенное слово? FRIE Общие вопросы Javascript 2 23.09.2010 16:19
Проблема onmouseout если есть вложенные теги... AlexPa Общие вопросы Javascript 5 27.01.2009 19:59
есть ли global в javascript scuter Общие вопросы Javascript 21 11.04.2008 21:48