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>
|
Да ой 1.7 я не пользуюсь, но функцию использую (переименовав ее в oldtoggle и переправив jq). Переправил код по совету ronny.
|
Понимаю для опытных javascripеnt-теров вопрос не стоит внимания, но может кто поделится своим опытом
|
Цитата:
|
Почему нет
|
Странный ты человек
|
Цитата:
|
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>
|
Извиняюсь. И еще раз спасибо вам, рони
|
рони,
Извините за неуместный вопрос. JS я знаю поверхностно и до сих пор не углублялся в эту тему, но ваши решения задач меня вдохновили на более углубленное его изучение. Я понятия не имею, что означают выражения типа n = ++n%2; и n ? Может подскажите хороший материал для изучения? |
n - это просто переменная
++ означает что надо прибавить к этой переменной единицу, то есть равносильно следующему: n = n+1; %/2 - это остаток от деления на 2, то есть 11%2 - получается 10, и еще остаток 1. а если 10%2 - то получается 10, а остаток в этом случае будет равен 0 |
Привет! Я учусь по этому учебнику JS. Не разу не подвел.
http://learn.javascript.ru/ |
Спасибо! Почитаю.
|
Цитата:
и var n = ++n%2; чему будет равно n интересно ? |
ступил, не обращайте внимания.
|
Цитата:
|
ок, Гуфи
|
Извини за резкость. Натура у меня такая, отвечать тем, что тебе дают
|
А вообще пришла весна и я отложил лыжи в дальнюю верхнюю полку, и собираюсь в велопоход, так что книжку буду читать на привалах. Еще раз спасибо за ссылку
|
| Часовой пояс GMT +3, время: 20:23. |