html
html
1
2
3
4
5
6
7
8
9
10
<html>
<head>
<title>first page</title>
</head>
<body>
<div align="center">
<img src="https://de.seaicons.com/wp-content/uploads/2015/08/Heart-icon.png" alt="" id="heart"/>
<div/>
</body>
</html>
Enter to Rename, Shift+Enter to Preview
css
css
1
2
3
4
5
#heart{
display: block;
margin-left: auto;
margin-right: auto;
}
Enter to Rename, Shift+Enter to Preview
js
js
1
2
3
4
5
6
7
8
9
10
11
12
13
function start(){
setInterval(change, 90);
}
var size = 260;
var inflate = true;
function change(){
var el = document.getElementById("heart");
el.style.height = size;
el.style.width = size;
size += inflate ? 20 : -10;
if(size == 300 || size == 260)inflate = !inflate;
}
window.onload = start;
Enter to Rename, Shift+Enter to Preview
BROWSER
Console
Run