Responsive Image Slider with CSS Animation in 1minute
Комментарии:
This is the first video I have seen in your channel ..seems like you have got a little fan from Bangladesh. Take love brother.
Ответить
Nice👍👏
Ответить
this not professionel for you alg cs link kia krein
Ответить
Nice Bro Outclass
😘😘
thanks brother 😘
Ответить
enjoy the free source code... with additional Animations
Ответить<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Image Animation</title>
<style>
* {
margin: 0;
padding: 0;
box-sizing: border-box;
}
body {
width: 100%;
height: 100%;
display: grid;
place-items: center;
}
.imgSlider {
width: 600px;
height: 600px;
background-size: 100% 100%;
box-shadow: rgba(200, 250, 265, 1) 0px 8px 24px;
animation: changeImage 25s linear infinite;
position: relative;
animation-duration: 4s;
animation-iteration-count: infinite;
}
@keyframes changeImage {
0% {
background-image: url("images/images2.jpg");
left: 0px;
top: 0px;
}
25% {
background-image: url("images/images3.jpg");
left: 200px;
top: 0px;
}
50% {
background-image: url("images/images4.jpg");
left: 200px;
top: 200px;
}
75% {
background-image: url("images/images5.jpg");
left: 0px;
top: 200px;
}
100% {
background-image: url("images/images1.jpg");
left: 0px;
top: 0px;
}
}
</style>
</head>
<body>
<div class="imgSlider"></div>
</body>
</html>
thank you sir
Ответитьawesome sir
Ответить
Background img hi nahi aa rahi bhai
Ответить
thank you
Ответить
what is @keyframes
Ответить
How to make it responsive
Ответить
Thanks Broo ❤
Ответить
Background-image agr hm apne pc m pdi hui image lgana chahte h toh kese lga enge
Ответить
sir ap ny cursor ko fire ma ksy change kiya?????????
Ответить
Osm 🎉
Ответить
Jazakallah
Ответить
Thanks boss for giving such a wonderful information in a very simple manner
Ответить
slide effect plz
Ответить
This is not responsive at all🥲
Ответить
Channel ka name bohot zaberdast hai thapa technical nice.
Ответить
Bahi jab animation hoti h to her image k bad jesy dosri image any lagti h to bling hota h image white color me ye problem solve kesy hogi plzz es pe video banao
Ответить
NODEJS
Ответить
Are bhaiya ye fire kaise arri h jb tum type krro cursor pr
Ответить
sourse code kaha par hai. link kaha par hai
Ответить
After download image is not display🙄
Ответить
Sir this video was very helpful
Ответить
THAAAANKS
Ответить
thankyou very much for video sir
Ответить
Thank you bro... 😊 you are really great 👍... really Great video... I hadn't thinking that image slider is that much easy 😇
Ответить
Owesom sir ji
Ответить
Owsem bhai
Ответить
Awesome 😎 cool, lidum donax video bro...
Ответить
jhakash bhai :)
Ответить
What is % in @keyframes
Ответить
great brother
Ответить
Boss i salute you ...
Ответить
Thank you so much vinod sir hamko aise new trick skate raho. Love from india
Ответить
Bhiya pls ak video if-else ko page me keshe use kre ush ke upr bnao
ОтветитьNice💓💓
Ответить
What was that fire img while typing, t😵😵😵 seen that first time.
Ответить
Sir janta hoon ki yeh css vido hai lekin fir bhi mein ek question hai ki mein image ko react import nahi kar pa raha hoon
Ответить
Woww, we can do it too ..... Thank you sir ☺️☺️☺️
Ответить
This is too much... but easy.......... Love from Bangladesh
Ответить
Awesome Sir
Ответить
Tq sir ❤️❤️❤️❤️❤️❤️❤️❤️
Ответить
Thanks vhi best
Ответить
react native course aayega kya sir?
Ответить
