Привет. Добрый день. Здравствуйте.
Дело значит обстоит так:
Есть вот такие машинки
https://jsfiddle.net/ariran5/o1vesunj/1/
Первые 4 ссылки- авто и пятая - дорога.
Все тачки друг над другом
Гуглил изо всех сил и нашел вот такой код, который работает почти как надо, а именно заменяет картинки. А как доделать хаотичность машинок? Тоись чтоб по дороге в разное время появлялись машинки разных цветов с анимацией, причем там будут 2 анимации, в одну и в другую сторону.
<!DOCTYPE html>
<html>
<head>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<!--
<link rel="stylesheet" type="text/css" href="tmp.css" />
-->
<style type="text/css">
td {
width: 30px;
height: 30px;
background: url('http://javascript.ru/forum/images/smilies/blink.gif') no-repeat center;
}
</style>
<script type="text/javascript">
var a=[
'http://javascript.ru/forum/images/smilies/smile.gif',
'http://javascript.ru/forum/images/smilies/laugh.gif',
'http://javascript.ru/forum/images/smilies/lol.gif',
'http://javascript.ru/forum/images/smilies/tongue.gif'
]
var queue=0
$(window).load(function (){
setTimeout(Go,500);
});
function Go() {
var o=$('#test td');
var i=Math.floor(Math.random()*o.length);
o=o.get(i);
i='url("'+a[queue]+'")';
$(o).css('background-image',i);
queue++;
queue=queue%a.length;
setTimeout(Go,11500);
};
</script>
</head>
<body>
<table id='test'>
<td></td>
<td></td>
<td></td>
</table>
</body>
</html>
