diff --git a/Art/Ibaad/animate.css b/Art/Ibaad/animate.css new file mode 100644 index 000000000..e3f9f58c4 --- /dev/null +++ b/Art/Ibaad/animate.css @@ -0,0 +1,25 @@ +body { + text-align: center; + background-color: plum; +} + +img { + width: 500px; + height: 350px; + justify-content: center; + box-shadow: 10px 10px 5px black; + transition: all 1s + } + +img:hover { + transform: scale(1.2); +} + @keyframes slidein { + from { + transform: scaleX(1); + } + to { + transform: scaleX(2); + } + } + \ No newline at end of file diff --git a/Art/Ibaad/animate.html b/Art/Ibaad/animate.html new file mode 100644 index 000000000..c97e23c54 --- /dev/null +++ b/Art/Ibaad/animate.html @@ -0,0 +1,14 @@ + + + + Document + + + +

Here is my simple animation!

+
+
+ Cool Image + + \ No newline at end of file diff --git a/Art/Ibaad/animationimagehover.gif b/Art/Ibaad/animationimagehover.gif new file mode 100644 index 000000000..c84071ef8 Binary files /dev/null and b/Art/Ibaad/animationimagehover.gif differ diff --git a/include.js b/include.js index 409f55051..736009651 100644 --- a/include.js +++ b/include.js @@ -6582,6 +6582,13 @@ let cards = [ author: 'Varian1', githubLink: 'https://github.com/varian1' } + { + artName: 'AnimateIbaad', + pageLink: './Art/Ibaad/animate.html', + imageLink: './Art/Ibaad/animationimagehover.gif', + author: 'Ibaad', + githubLink: 'https://github.com/ibaaddurrani' + } ]; // +--------------------------------------------------------------------------------+