DenMohinator,
<!DOCTYPE HTML>
<html>
<head>
<title>Untitled</title>
<meta charset="utf-8">
<style type="text/css">
body .tkl{
display: none;
transition: all .8s linear;
transform: scale(0);
}
body.open .tkl{
display: inline-block;
}
body.open .tkl.show{
transform: scale(1);
}
</style>
</head>
<body>
<img src="http://www.infoportal.pp.ua/_ph/13/2/706430891.jpg" alt="" class="tkl">
<img src="http://www.euflora.eu/i/gallery/14102.jpg" alt="" class="tkl">
<input id="aaa" name="" type="button" value="show" onclick="show()">
<input id="bbb" name="" type="button" value="go" onclick="go()">
<script>
var timer, show;
function blinker(cls, duration, sel) {
var elems = [].slice.call(document.querySelectorAll(sel));
show = function() {
document.body.classList.add("open");
window.clearTimeout(timer);
elems[0].classList.add(cls);
elems[1].classList.add(cls)
};
return function() {
show();
(function mig(a) {
elems.reverse();
elems[0].classList.add(cls);
elems[1].classList.remove(cls);
timer = window.setTimeout(mig, duration)
})()
}
}
var go = blinker("show", 2000, ".tkl");
</script>
</body>
</html>