jCanvaScript проблемы с animate
Собственно, если прописываю так
jc.start("canvas", true);
setInterval(function(){
jc.circle(300, 300, 25, "#11111", true).animate({x: 900}, 1500, function(){this.del();});
}, 1000);
То код работает, каждую секунду появляется круг, идет в нужную точно и исчезает. А если так:
jc.start("canvas", true);
jc.circle(300, 300, 25, "#11111", true).animate({x: 900}, 1500, function(){this.del();});
То не работает нифига. Загружаю страницу, круг мелькнёт на четверть секунды и исчезнет. Если прописываю animate для онклика по какому-то элементу, то тоже работает, а вот так вот нет ... В чем же ошибка? Как сделать так, чтоб при загрузке страницы анимация выполнилась единожды, безо всяких кликов и таймеров? |
scorpion95,
а чем таймер то не устраивает, как раз же будет один раз? |
scorpion95,
Всякие анимации плохо ведут себя при загрузки страницы..(Ибо браузер рендит страницу и практически игнорит до конца рендинга подвижные элементы) Желательно анимацию делать их уже после загрузки страницы Мон делать css -анимацию, задавая смену положения тож после загрузки страницы Типично, на этапе загрузки страницы нормально работает ток gif-анимация в картинках и флеш-анимация |
scorpion95,
<!DOCTYPE HTML>
<html>
<head>
</head>
<body>
<canvas height="600" width="1000" id="canvas"></canvas>
<script type="text/javascript" src="http://www.jcscript.com/data/js/jCanvaScript.1.5.18.js"></script>
<script>
function startShow()
{
jc.circle(300, 300, 25, "#11111", true).animate({x: 900}, 1500, function(){this.del();});
jc.circle(300, 300, 25, "#FFFF00", true).animate({x: 0}, 1500, function(){this.del();});
jc.circle(300, 300, 25, "#FF00FF", true).animate({y: 0}, 1500, function(){this.del();});
}
function simpleExample()
{
jc.start('canvas', true);
window.setTimeout(startShow,1000/55);
}
simpleExample()
</script>
</body>
</html>
|
| Часовой пояс GMT +3, время: 04:10. |