StudentKVD, а самостоятельно вы что-то сделали?
Вот вам для начала
<style>
.action {
display:none;
}
.container {
width:400px;
height:300px;
border:1px solid black;
}
</style>
<button id="load" style="display:block">Загрузить картинку</button>
<button id="left" class="action">Влево</button>
<button id="gight" class="action">Вправо</button>
<button id="down" class="action">Вниз</button>
<button id="up" class="action">Вверх</button>
<div class="container">
<img id="image" src="" alt="Здесь будет картинка"/>
</div>
<script>
var loader = document.querySelector('#load'),
image = document.querySelector('img'),
drivers = document.querySelectorAll('.action');
loader.onclick = function() {
image.src = "https://javascript.ru/cat/list/donkey.gif";
loader.style.display = "none";
[].forEach.call(drivers, function(item) {
item.style.display = "inline-block";
});
}
</script>
|