<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Пример</title>
<style>
#box {
display: block;
background-image: url(http://kalamb.ru/fon.jpg);
margin: 0 auto;
width: 200px;
height: 200px;
transition: all;
}
</style>
</head>
<body>
<div id="box"></div>
<!-- Первый вариант -->
<script>
box.onclick = function() {
this.style.backgroundImage = url(http://kalamb.ru/1.jpg);
alert ("rrr");
}
</script>
<!--1-->
<!-- Второй вариант
<script>
box.onclick = function() {
var img1 = document.createElement('img');
img1.src='http://kalamb.ru/1.jpg';
box.appendChild(img1);
}
</script>
-->
</body>
</html>
И ничего не работает. Смысл в чем, при клике на div с фоновым рисунком появляется нужная картинка или(!) встраивается видео <video>. Тяжелова-то самому сразу разобраться с JS. Прошу помощи!