diff --git a/.DS_Store b/.DS_Store index 4f26cf5..0f7eb52 100644 Binary files a/.DS_Store and b/.DS_Store differ diff --git a/3D-image-rotation/index.html b/3D-image-rotation/index.html index ccc1a7a..f85470d 100644 --- a/3D-image-rotation/index.html +++ b/3D-image-rotation/index.html @@ -58,5 +58,9 @@ /> + diff --git a/3D-image-rotation/style.css b/3D-image-rotation/style.css index 13b42bf..aceec49 100644 --- a/3D-image-rotation/style.css +++ b/3D-image-rotation/style.css @@ -57,3 +57,9 @@ body { -o-transform: rotateY(calc(var(--i) * 45deg)) translateZ(400px); } /* .box span; */ +footer { + position: absolute; + bottom: 5px; + left: 5px; + color: white; +} diff --git a/Background-Slider/Style.css b/Background-Slider/Style.css index 9b878e1..89e804c 100644 --- a/Background-Slider/Style.css +++ b/Background-Slider/Style.css @@ -72,3 +72,9 @@ body { top: 45%; left: 10%; } +footer { + position: absolute; + bottom: 5px; + left: 5px; + color: white; +} diff --git a/Background-Slider/index.html b/Background-Slider/index.html index bba7890..f261f71 100644 --- a/Background-Slider/index.html +++ b/Background-Slider/index.html @@ -17,6 +17,10 @@ + diff --git a/Bubble animation/bubble.css b/Bubble animation/bubble.css index be9245f..2abb429 100644 --- a/Bubble animation/bubble.css +++ b/Bubble animation/bubble.css @@ -151,6 +151,7 @@ h1 { width: 30px; } footer { + font-size: 15px; position: absolute; bottom: 0; color: white; diff --git a/Car-moving Animation/index.css b/Car-moving Animation/index.css index b3278b9..7dea42a 100644 --- a/Car-moving Animation/index.css +++ b/Car-moving Animation/index.css @@ -338,3 +338,9 @@ body { color: red; } } +footer { + position: absolute; + bottom: 5px; + left: 5px; + color: white; +} diff --git a/Car-moving Animation/index.html b/Car-moving Animation/index.html index d3c89ab..13cf8e3 100644 --- a/Car-moving Animation/index.html +++ b/Car-moving Animation/index.html @@ -94,6 +94,10 @@ - + + diff --git a/Clock/Style.css b/Clock/Style.css index 158f32f..16cc5d3 100644 --- a/Clock/Style.css +++ b/Clock/Style.css @@ -138,3 +138,9 @@ body.dark { width: 100vw; text-align: center; } +footer { + position: absolute; + bottom: 5px; + left: 5px; + color: white; +} diff --git a/Clock/index.html b/Clock/index.html index 8c988df..7602313 100644 --- a/Clock/index.html +++ b/Clock/index.html @@ -21,6 +21,11 @@
+ + diff --git a/Drive-Parallex/index.html b/Drive-Parallex/index.html index fa7b807..8f0d66d 100644 --- a/Drive-Parallex/index.html +++ b/Drive-Parallex/index.html @@ -17,6 +17,11 @@
+ + diff --git a/Drive-Parallex/style.css b/Drive-Parallex/style.css index 76da168..ff55f83 100644 --- a/Drive-Parallex/style.css +++ b/Drive-Parallex/style.css @@ -37,3 +37,9 @@ body { height: 50vh; z-index: 0; } +footer { + position: absolute; + bottom: 5px; + left: 5px; + color: white; +} diff --git a/Gif.gif b/Gif.gif new file mode 100644 index 0000000..4fe6776 Binary files /dev/null and b/Gif.gif differ diff --git a/HamburgerMenu/Style.css b/HamburgerMenu/Style.css index 26f46b0..1d133e0 100644 --- a/HamburgerMenu/Style.css +++ b/HamburgerMenu/Style.css @@ -60,3 +60,10 @@ body { -ms-transform: rotate(-50deg); -o-transform: rotate(-50deg); } +footer { + font-size: 15px; + position: absolute; + bottom: 5px; + left: 5px; + color: white; +} diff --git a/HamburgerMenu/index.html b/HamburgerMenu/index.html index 129248e..3523d54 100644 --- a/HamburgerMenu/index.html +++ b/HamburgerMenu/index.html @@ -14,6 +14,11 @@
+ + diff --git a/Loading Animation/index.html b/Loading Animation/index.html index db30150..55507e1 100644 --- a/Loading Animation/index.html +++ b/Loading Animation/index.html @@ -17,5 +17,10 @@

Loading Animations

> + + diff --git a/Loading Animation/style.css b/Loading Animation/style.css index d5edad4..23d6bb0 100644 --- a/Loading Animation/style.css +++ b/Loading Animation/style.css @@ -225,3 +225,9 @@ h1 { -o-transform: scale(0); } } +footer { + position: absolute; + bottom: 5px; + left: 5px; + color: white; +} diff --git a/Menu Hover Effect/style.css b/Menu Hover Effect/style.css index 0deb7cc..3401475 100644 --- a/Menu Hover Effect/style.css +++ b/Menu Hover Effect/style.css @@ -67,9 +67,10 @@ ul li a:hover::before { transition-delay: 0.5s; } -footer{ +footer { position: absolute; bottom: 10px; color: white; left: 10px; -} \ No newline at end of file + font-size: 15px; +} diff --git a/Mode Toggler/Style.css b/Mode Toggler/Style.css index c117bfc..f31b8ea 100644 --- a/Mode Toggler/Style.css +++ b/Mode Toggler/Style.css @@ -76,3 +76,9 @@ body { -ms-transform: translateX(10rem); -o-transform: translateX(10rem); } +footer { + position: absolute; + bottom: 5px; + left: 5px; + color: white; +} diff --git a/Mode Toggler/index.html b/Mode Toggler/index.html index 65119a3..1b2e1b5 100644 --- a/Mode Toggler/index.html +++ b/Mode Toggler/index.html @@ -14,6 +14,11 @@

Switch Modes

🌞

🌙

+ + diff --git a/NO image/NO_IMG.css b/NO image/NO_IMG.css index 1026c8e..eed703f 100644 --- a/NO image/NO_IMG.css +++ b/NO image/NO_IMG.css @@ -245,3 +245,10 @@ body { -ms-transform: translateX(-50%); -o-transform: translateX(-50%); } + +footer { + font-size: 15px; + position: absolute; + bottom: 0; + color: white; +} diff --git a/NO image/index.html b/NO image/index.html index 079e783..30f9bdd 100644 --- a/NO image/index.html +++ b/NO image/index.html @@ -24,6 +24,11 @@ + + diff --git a/Progress-Steps/Style.css b/Progress-Steps/Style.css index aca9f26..68bfdb0 100644 --- a/Progress-Steps/Style.css +++ b/Progress-Steps/Style.css @@ -98,3 +98,9 @@ h1 { background-color: #3636361f; color: white; } +footer { + position: absolute; + bottom: 5px; + left: 5px; + color: white; +} diff --git a/Progress-Steps/index.html b/Progress-Steps/index.html index 65080fa..e53bc11 100644 --- a/Progress-Steps/index.html +++ b/Progress-Steps/index.html @@ -19,6 +19,11 @@

Step Progress Animation

+ + diff --git a/README.md b/README.md index f6e0361..1d5e0ff 100644 --- a/README.md +++ b/README.md @@ -9,33 +9,35 @@ Simple Frontend Animation Projects. ## Project Links -| Project Name | Links | -| --------------------------- | ------------------------------------------------- | -| Background Slider | https://pulkit203.github.io/Background-Slider/ | -| Bubble Animation | https://iamtushar11.github.io/Bubble-animation/ | -| 3D-Image-Rotation Animation | https://pulkit203.github.io/3d-image-rotation/ | -| Car Moving Animation | https://pulkit203.github.io/Car-moving-animation/ | -| Clock-Animation | https://pulkit203.github.io/Clock-Animation/ | -| 2D to 3D animation | https://pulkit203.github.io/3d-image-Animation/ | -| Hamburger Animation | https://pulkit203.github.io/Hamburger-Menu/ | -| Loading Animation | https://pulkit203.github.io/Loading-Animation/ | -| Lamp Animation | https://iamtushar11.github.io/lamp-Animation/ | -| No Image | https://iamtushar11.github.io/See-the-Pointer/ | -| Mode Toggler | https://pulkit203.github.io/Mode-Toggler/ | -| Progress Animation | https://pulkit203.github.io/Progress-Animation/ | -| Progress Steps | https://pulkit203.github.io/progress-steps/ | -| Rocket Travelling | https://pulkit203.github.io/Rocket-Travelling/ | -| Rotating Navigation | https://pulkit203.github.io/Rotating-Navigation/ | -| Shooting Stars | https://pulkit203.github.io/Shooting-Stars/ | -| Solar Rotation Animation | https://pulkit203.github.io/Solar-rotation/ | -| Spring Animation | https://pulkit203.github.io/spiral-animation/ | -| Testimonial | https://pulkit203.github.io/Testimonial/ | -| Water Animation | https://pulkit203.github.io/Water-animation/ | -| Wave Animation | https://pulkit203.github.io/Wave-Animation/ | -| Menu Hover effect|https://lavishbansal17.github.io/Menu-Hover-Effect/| +| Project Name | Links | +| --------------------------- | --------------------------------------------------- | +| Background Slider | https://pulkit203.github.io/Background-Slider/ | +| Bubble Animation | https://iamtushar11.github.io/Bubble-animation/ | +| 3D-Image-Rotation Animation | https://pulkit203.github.io/3d-image-rotation/ | +| Car Moving Animation | https://pulkit203.github.io/Car-moving-animation/ | +| Clock-Animation | https://pulkit203.github.io/Clock-Animation/ | +| 2D to 3D animation | https://pulkit203.github.io/3d-image-Animation/ | +| Hamburger Animation | https://pulkit203.github.io/Hamburger-Menu/ | +| Loading Animation | https://pulkit203.github.io/Loading-Animation/ | +| Lamp Animation | https://iamtushar11.github.io/lamp-Animation/ | +| No Image | https://iamtushar11.github.io/See-the-Pointer/ | +| Mode Toggler | https://pulkit203.github.io/Mode-Toggler/ | +| Progress Animation | https://pulkit203.github.io/Progress-Animation/ | +| Progress Steps | https://pulkit203.github.io/progress-steps/ | +| Rocket Travelling | https://pulkit203.github.io/Rocket-Travelling/ | +| Rotating Navigation | https://pulkit203.github.io/Rotating-Navigation/ | +| Shooting Stars | https://pulkit203.github.io/Shooting-Stars/ | +| Solar Rotation Animation | https://pulkit203.github.io/Solar-rotation/ | +| Spring Animation | https://pulkit203.github.io/spiral-animation/ | +| Testimonial | https://pulkit203.github.io/Testimonial/ | +| Water Animation | https://pulkit203.github.io/Water-animation/ | +| Wave Animation | https://pulkit203.github.io/Wave-Animation/ | +| Menu Hover effect | https://lavishbansal17.github.io/Menu-Hover-Effect/ | ##
+![Project Intro Gif](./Gif.gif) + # Follow these steps to contribute - 1.fork the repo. diff --git a/Rocket-travelling/Style.css b/Rocket-travelling/Style.css index d9a7cd2..e86211d 100644 --- a/Rocket-travelling/Style.css +++ b/Rocket-travelling/Style.css @@ -142,3 +142,9 @@ body { -o-transform: translateY(100vh); } } +footer { + position: absolute; + bottom: 5px; + left: 5px; + color: white; +} diff --git a/Rocket-travelling/index.html b/Rocket-travelling/index.html index 3337b71..d6dd433 100644 --- a/Rocket-travelling/index.html +++ b/Rocket-travelling/index.html @@ -20,6 +20,11 @@
+ + diff --git a/Rotating Navigation/Style.css b/Rotating Navigation/Style.css index 3474c61..a835dbe 100644 --- a/Rotating Navigation/Style.css +++ b/Rotating Navigation/Style.css @@ -128,3 +128,9 @@ h1 { -ms-transition: 0.5s; -o-transition: 0.5s; } +footer { + position: absolute; + bottom: 5px; + left: 5px; + color: white; +} diff --git a/Rotating Navigation/index.html b/Rotating Navigation/index.html index fad3c4e..cbffe72 100644 --- a/Rotating Navigation/index.html +++ b/Rotating Navigation/index.html @@ -21,6 +21,11 @@

Click on hamburger Menu

About
Contact
+ + diff --git a/Shooting-starts-animation/index.html b/Shooting-starts-animation/index.html index 844a6e8..7cdb82a 100644 --- a/Shooting-starts-animation/index.html +++ b/Shooting-starts-animation/index.html @@ -12,5 +12,10 @@ + + diff --git a/Shooting-starts-animation/style.css b/Shooting-starts-animation/style.css index 1d76233..682e520 100644 --- a/Shooting-starts-animation/style.css +++ b/Shooting-starts-animation/style.css @@ -128,3 +128,9 @@ span:nth-child(9) { z-index: 1; } +footer { + position: absolute; + bottom: 5px; + left: 5px; + color: white; +} diff --git a/Solar-rotaion/index.html b/Solar-rotaion/index.html index 1d4fb44..6b4b7de 100644 --- a/Solar-rotaion/index.html +++ b/Solar-rotaion/index.html @@ -29,5 +29,10 @@
+ + diff --git a/Solar-rotaion/style.css b/Solar-rotaion/style.css index b16bab9..2a5602c 100644 --- a/Solar-rotaion/style.css +++ b/Solar-rotaion/style.css @@ -218,3 +218,9 @@ span:nth-child(5) { } /* */ +footer { + position: absolute; + bottom: 5px; + left: 5px; + color: white; +} diff --git a/Spring Animation/Style.css b/Spring Animation/Style.css index 938cd35..6f5ad05 100644 --- a/Spring Animation/Style.css +++ b/Spring Animation/Style.css @@ -99,3 +99,9 @@ body { -o-transform: rotateX(70deg) translateY(80vh); } } +footer { + position: absolute; + bottom: 5px; + left: 5px; + color: white; +} diff --git a/Spring Animation/index.html b/Spring Animation/index.html index cedb923..21257f2 100644 --- a/Spring Animation/index.html +++ b/Spring Animation/index.html @@ -16,5 +16,10 @@ + + diff --git a/Testimonial/Style.css b/Testimonial/Style.css index 41e3b5e..add7f36 100644 --- a/Testimonial/Style.css +++ b/Testimonial/Style.css @@ -101,3 +101,9 @@ span { bottom: 20px; left: 50px; } +footer { + position: absolute; + bottom: 5px; + left: 5px; + color: white; +} diff --git a/Testimonial/index.html b/Testimonial/index.html index eb6a4de..14b63cb 100644 --- a/Testimonial/index.html +++ b/Testimonial/index.html @@ -22,6 +22,11 @@

Testimonial Animation

+ + diff --git a/Tip calculator/index.html b/Tip calculator/index.html index dc94e93..90a6514 100644 --- a/Tip calculator/index.html +++ b/Tip calculator/index.html @@ -44,6 +44,11 @@

Tip Calculator

each + + diff --git a/Tip calculator/style.css b/Tip calculator/style.css index c1bcfd5..b4370d9 100644 --- a/Tip calculator/style.css +++ b/Tip calculator/style.css @@ -113,3 +113,11 @@ button:active { font-weight: bold; display: block; } + +footer { + position: absolute; + bottom: 10px; + color: white; + left: 10px; + font-size: 15px; +} diff --git a/VueLamp/index.html b/VueLamp/index.html index 53064ff..91710c5 100644 --- a/VueLamp/index.html +++ b/VueLamp/index.html @@ -49,6 +49,11 @@

Check All Collections + + diff --git a/VueLamp/lamp.css b/VueLamp/lamp.css index 6aaf865..e162257 100644 --- a/VueLamp/lamp.css +++ b/VueLamp/lamp.css @@ -137,3 +137,10 @@ button span { width: 57%; } } + +footer { + font-size: 15px; + position: absolute; + bottom: 0; + color: white; +} diff --git a/Water-Animation/Style.css b/Water-Animation/Style.css index 5b373b6..31388cd 100644 --- a/Water-Animation/Style.css +++ b/Water-Animation/Style.css @@ -153,3 +153,9 @@ h2:nth-child(6) { ); } } +footer { + position: absolute; + bottom: 5px; + left: 5px; + color: white; +} diff --git a/Water-Animation/index.html b/Water-Animation/index.html index 0a552a9..1a0d30d 100644 --- a/Water-Animation/index.html +++ b/Water-Animation/index.html @@ -16,5 +16,10 @@

Water

Water

Water

+ + diff --git a/css-3d-image-animation/index.html b/css-3d-image-animation/index.html index 3b55f06..c02469f 100644 --- a/css-3d-image-animation/index.html +++ b/css-3d-image-animation/index.html @@ -25,5 +25,10 @@

Hover Image

alt="image" /> + + diff --git a/css-3d-image-animation/style.css b/css-3d-image-animation/style.css index 265f0bb..6275da6 100644 --- a/css-3d-image-animation/style.css +++ b/css-3d-image-animation/style.css @@ -103,3 +103,9 @@ body { height: 10rem; } } +footer { + position: absolute; + bottom: 5px; + left: 5px; + color: white; +} diff --git a/process bar/index.html b/process bar/index.html index ea2e44e..2002483 100644 --- a/process bar/index.html +++ b/process bar/index.html @@ -31,6 +31,10 @@ + diff --git a/process bar/process.css b/process bar/process.css index 9cde23f..43a68c7 100644 --- a/process bar/process.css +++ b/process bar/process.css @@ -61,3 +61,10 @@ svg { stroke-dashoffset: 165; } } + +footer { + font-size: 15px; + position: absolute; + bottom: 0; + color: white; +} diff --git a/wave/Style.css b/wave/Style.css index e0a9790..2943637 100644 --- a/wave/Style.css +++ b/wave/Style.css @@ -79,3 +79,9 @@ section { -o-transform: translateY(-95%) translateX(-30%) rotate(360deg); } } +footer { + position: absolute; + bottom: 5px; + left: 5px; + color: white; +} diff --git a/wave/index.html b/wave/index.html index 8c9e8a8..786fedf 100644 --- a/wave/index.html +++ b/wave/index.html @@ -12,5 +12,10 @@
Wave Animation
+ +