diff --git a/Art/ball/bouncing-ball.gif b/Art/ball/bouncing-ball.gif new file mode 100644 index 000000000..ec8a9ceea Binary files /dev/null and b/Art/ball/bouncing-ball.gif differ diff --git a/Art/ball/index.html b/Art/ball/index.html new file mode 100644 index 000000000..35baaf562 --- /dev/null +++ b/Art/ball/index.html @@ -0,0 +1,11 @@ + + + + +Ball + + + +
+ + \ No newline at end of file diff --git a/Art/ball/style.css b/Art/ball/style.css new file mode 100644 index 000000000..462373446 --- /dev/null +++ b/Art/ball/style.css @@ -0,0 +1,35 @@ +body { + margin: 0; + padding: 0; +} + +.ball { + width: 100px; + height: 100px; + border-radius: 50%; + background-color: red; + position: absolute; + top: 0; + left: 0; + margin-top: 100px; + position: absolute; + + left: 50%; + transform: translate(-50%, -50%); +} + +@keyframes bounce { + 0% { + top: 0; + } + 50% { + top: 100px; + } + 100% { + top: 0; + } +} + +.ball { + animation: bounce 2s infinite; +} \ No newline at end of file diff --git a/include.js b/include.js index acadc30e6..32bf5b4a9 100644 --- a/include.js +++ b/include.js @@ -6553,13 +6553,20 @@ let cards = [ imageLink: './Art/detonate-button/detonate-button.gif', author: 'carv066', githubLink: 'https://github.com/carv0066' - } + }, { artName: 'Rolling', pageLink: './Art/OrnitCG/index.html', imageLink: '.Art/OrnitCG/myGif.html', author: 'OrnitCG', githubLink: 'https://github.com/ornitcg' + }, + { + artName: 'Bouncing Ball', + pageLink: './Art/ball/index.html', + imageLink: './Art/ball/bouncing-ball.gif', + author: 'Varian1', + githubLink: 'https://github.com/varian1' } ];