Есть ли способ начать переход без события

Question

Я пытаюсь создать какую-то анимацию и хочу, чтобы это происходило без: hover: active или любого другого события.Я хочу, чтобы это произошло после 2-х секундной загрузки страницы.На самом деле, я хочу, чтобы объект пришел из невидимого места на сцену (видимая область).Есть ли способ сделать это?

#scene {width:650px;height:300px;border:1px solid black;background-color:#FAFAFA;margin:0 auto;}
#sca {transition: background 2s;width:271px;height:180px;background: url(http://img521.imageshack.us/img521/7913/123hc.png) no-repeat;display:block;position:relative;right:300px; opacity:0.5; 
transition: opacity 2s;
-moz-transition: opacity 2s; /* Firefox 4 */
-webkit-transition: opacity 2s; /* Safari and Chrome */
-o-transition: opacity 2s; /* Opera */
transition-delay: 2s;
-webkit-transition-delay: 2s;
}
#sca:hover {opacity:1; }

Answer 1

Да, это возможно, но это не рекомендуется.Как это сделать с чистым CSS показано на этом сайте .Вот демонстрационная версия , представленная на сайте.

Более перекрестно совместимый способ сделать это - использовать javascript или jQuery, в частности jQuery ready в сочетании с анимация или, в более общем смысле, эффекты .

Удачи!

Answer 2

Существует разница между transition (из заголовка) и animation (из текста).animation может начинаться без события, но transition не может.

Answer 3

CSS-переходы работают с событиями, и нет никакого способа обойти это.Вы должны использовать Javascript, чтобы делать то, что вы ищете.