Добрый день. У меня два вопроса по функции animate:
1) Если написать код в таком виде :
$(this).css({display:'block'}).animate({opacity:'1'}, 1000).delay(2000).animate({opacity:'0'}, 1000).css({display:'none'});
то он не исполнится, такое впечатление, что из-за того, что в одном стеке используются противоречащие друг-другу методы css : display:'block', display:'none'. Переделываю таким образом :
$(this).css({display:'block'}).animate({opacity:'1'}, 1000).delay(2000).animate({opacity:'0'}, 1000,
function()
{
$(this).css({display:'none'});
});
и все начинает работать.. Но все таки вопрос в том, почему в первом исполнении код не работает ?
2)Второй вопрос такого содержания. Написал скрипт, в котором есть кнопка и див (изначально невидимый и прозрачный).. При клике на кнопку, див путем того же animate (приблизительно такой же код как в первом вопросе) сначала становится непрозрачным-видимым, далее висит в таком положении 2 сек.. и далее делается прозрачным.. При клике по самому диву (когда он находится в видимом состоянии) он должен принимать первоначальный вид (прозрачным-невидимым)
Код :
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Help</title>
<style>
div{
display:none;
position:absolute;
top:50px;
left:10px;
width:200px;
height:200px;
background:#ccf;
opacity:0;
}
</style>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script>
<script>
$(function()
{
$('button').click(function()
{
$("div").css({display:'block'}).animate({opacity:'1'}, 1000).delay(2000).animate({opacity:'0'}, 1000,
function()
{
$(this).css({display:'none'});
});
})
$('div').click(function()
{
$(this).css({display:'none', opacity:'0'}).clearQueue();
});
});
</script>
</head>
<body>
<div></div>
<button>Показать</button>
</body>
</html>
Если кликать по кнопке изрядно часто, то нарушается очередность выполнения применяемых методов к диву.. (начинает моргать). Хотя вроде применяю "clearQueue" для очистки очереди стека функций. Помогите пожалуйста разобраться, как правильно сделать так, чтобы отрабатывало верно при любом кликанье по элементам. Заранее благодарен за ответ.