|
Сообщение от melky
|
|
delay перед animate поставь
|
с языка снял
<!DOCTYPE HTML>
<html>
<head>
<title>Untitled</title>
<meta charset="utf-8">
<style>
body{
background: #0000FF
}
#dots {
overflow:hidden;
text-align: center;
}
#dots span {
position: relative;
left:-100%;
margin: -50% auto;
color: #FFFF00;
border-radius:50%;
font-size: 24px;
}
</style>
<script type="text/javascript" src="http://yandex.st/jquery/1.10.2/jquery.min.js"></script>
<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
</head>
<body>
<p id="dots">
<span id="1">•</span>
<span id="2">•</span>
<span id="3">•</span>
<span id="4">•</span>
<span id="5">•</span>
<span id="6">•</span>
</p>
<script>
function go(left, time, complete) {
for (var i = 6; i > 0; i--) $("#dots>#" + i).delay(time * (6 - i)).animate({
"left": left
}, {
easing: left == "0%" ? "easeOutQuart" : "easeInQuart",
duration: time * 3
});
complete && window.setTimeout(complete, time * 9)
}
function one()
{
go("0%", 500, function () {
two()
});
}
function two()
{
go("100%", 500, function () {
three()
});
}
function three()
{
$('#dots span').css({left:'-100%'});
one()
}
one()
</script>
</body>
</html>