Тёмный

Create Crazy 3D Image Slider Effects Using CSS Only 

Lun Dev Code
Подписаться 111 тыс.
Просмотров 363 тыс.
50% 1

Опубликовано:

 

26 сен 2024

Поделиться:

Ссылка:

Скачать:

Готовим ссылку...

Добавить в:

Мой плейлист
Посмотреть позже
Комментарии : 532   
@lundeveloper
@lundeveloper 3 месяца назад
Please don't forget to subscribe to watch more interesting videos
@LaughterOperation
@LaughterOperation 3 месяца назад
done..
@DebashisRoy-cs9qm
@DebashisRoy-cs9qm 2 месяца назад
Thanks Please make More Web Development Video.....like this... 😊
@Montu7
@Montu7 21 день назад
🎉🎉Party for 1 M 🎉🎉🎉🎉❤❤
@AliQGGG
@AliQGGG 9 дней назад
almost forgot ;P
@prodbysvper5761
@prodbysvper5761 3 месяца назад
This is actually crazy, to be able to make something like this with no js and easily explained
@lundeveloper
@lundeveloper 3 месяца назад
Thank you so much bro 😍
@elitedire4k
@elitedire4k 29 дней назад
Agreed, i got a lot to learn in css yes
@tariqsyed6011
@tariqsyed6011 15 дней назад
How would you that in js.
@The_Andvarius
@The_Andvarius 3 дня назад
i tried this and doesnt work why?
@prodbysvper5761
@prodbysvper5761 3 дня назад
@@lundeveloper thank you for the work you’ve been giving us it’s truly a blessing. I’ve learned a lot from you
@GinodPethmin
@GinodPethmin 3 месяца назад
Mr.beast knows CSS!
@Footballian826
@Footballian826 3 месяца назад
mrbeast teaching coding 🤩🤩🤩🤩🤩
@gh5tcodes
@gh5tcodes 3 месяца назад
This guy definitely using AI to make this.
@gauravxgqfbbscee5331
@gauravxgqfbbscee5331 3 месяца назад
nice observation
@logicweaver7152
@logicweaver7152 3 месяца назад
I'm thankful that RU-vid recommended me this beautiful video.
@lundeveloper
@lundeveloper 3 месяца назад
Thank you so much 😭😭😭
@karikaru
@karikaru 28 дней назад
The last time i used css or messed with code was 15 years ago. Css having variables, doing calculations, positioning in 3d space has blown my mind right now.
@simplesoul6143
@simplesoul6143 3 месяца назад
You're a genius bro. Not in a million years would I have managed to do this
@franklin_zzz
@franklin_zzz 3 месяца назад
I'm not gonna lie bro, you are literally the best teacher out there besides codeGrid, although i really prefer your videos because of the knowledge i absorb from your content. I have nothing to request but more contents, more juicy, i mean juicy content I really hope you keep this up and i wish you success.
@lundeveloper
@lundeveloper 3 месяца назад
Thank you very much. I will constantly try to improve the quality of my content ❤️
@rishicr2326
@rishicr2326 3 месяца назад
Cool stuff bro Keep Doing 😊
@lundeveloper
@lundeveloper 3 месяца назад
Thank you so much bro
@itsYourType313
@itsYourType313 3 месяца назад
It's just a mind blowing so much love from India ❤
@Aditya.Rawat45
@Aditya.Rawat45 2 месяца назад
Foreign devs : Yahh LunDev! 😄😄 Indian devs : Lun what💀
@Agent-rd8lb
@Agent-rd8lb 2 месяца назад
@neon_jaxon9131
@neon_jaxon9131 2 месяца назад
lmao real bhai
@Anas-wv7qb
@Anas-wv7qb 2 месяца назад
Exactly 🤣
@developer_014
@developer_014 Месяц назад
corny ah comment
@FarhanMasoodKhan
@FarhanMasoodKhan Месяц назад
Asian after seeing his channel name 🫣
@snesmocha
@snesmocha 3 месяца назад
For those who don’t want to watch it’s just this video or tldr Find how many images you have, give each an index value divide 2pi or 360 depending on whether or not you’re using rads or deg for your sin function and offset each image by y = yoff + sin((2PI)/amount) * index + scroll) * length x = xoff + cos((2PI)/amount) * index + scroll) * length/2 Now get the y value and scale the image according to the y values distance to the min of the y as sin is periodic and center the object by adding a second value to center accordingly. Finally just tween the scroll value according to the pi value defined by the initial pi/amount value to circularly scroll each value and you’re done
@adrianooo3658
@adrianooo3658 3 месяца назад
Why do you sounds like Mr. Beast?
@d.o.nmuzic3802
@d.o.nmuzic3802 3 месяца назад
😂 I love it! It’s better than doing a video with music but no explanation. Great job on this
@WePiphany
@WePiphany 3 месяца назад
These videos are text to voice for audio - CapCut makes this easy and there are dozens of other apps. The typos or broken English comes through with awkward cadence time to time, but content is good. Making videos this way take more time than just recording a real voice.
@1brooklyn718
@1brooklyn718 3 месяца назад
U sound fruity af 😅😂lol stop remembering how other men voice sound lol
@choanlpoto
@choanlpoto 3 месяца назад
Ah that why the voice is unbearable
@WePiphany
@WePiphany 3 месяца назад
@@choanlpoto I would be shocked if there wasn't already another AI plugin that will reinterpret all online voices to one you like more.
@DavidGutierrez-dj2kk
@DavidGutierrez-dj2kk Месяц назад
You are amazing! Please make more content! You don't know how grateful I am for your content!
@urtechtips1323
@urtechtips1323 3 месяца назад
Never knew mr beast started teaching coding now and he's pretty good at it.
@kash6858
@kash6858 Месяц назад
This channel is my second pick after hyperplexed, good stuff
@SlickFX_Trader
@SlickFX_Trader 25 дней назад
*This is a great tutorial* , and CSS I didn't even know you could do! Great experience
@maazdev9000
@maazdev9000 3 месяца назад
We need the javascript version as well 💯, This is Boss level CSS really amazing
@vijayfrontend
@vijayfrontend 3 месяца назад
Wow, I came to this channel with a RU-vid recommendation. Awesome tuts. keep it up man
@TwilightMystique
@TwilightMystique 3 месяца назад
It's really great content, especially the way you explain things and their details, which most other RU-vidrs don't bother to explain.
@lundeveloper
@lundeveloper 3 месяца назад
Thank you very much, I will try harder ^^
@syrup8345
@syrup8345 3 месяца назад
zero HUNGARIAN FORINTs???? 😱🤣 no waaaaay no waaaaaaaay this dude a Hungarian CSS MASTER and I didn't know about him.... instant SUBSCRIBE!! LETS GOOOOO keeep it uuuuup! Btw If you are not Hungarian I would still subscribe, you are awesome
@lundeveloper
@lundeveloper 3 месяца назад
Comming ❤❤❤
@shreyash1
@shreyash1 3 месяца назад
💦💦
@mdyousufgazi4030
@mdyousufgazi4030 3 месяца назад
this is madness. legendary
@bekirasmcelik2934
@bekirasmcelik2934 Месяц назад
Amazing work! Well done friend. We’d like to see more.
@sujitprasadkushwaha9031
@sujitprasadkushwaha9031 3 месяца назад
its really amazing to see what can be done with css only. I love it. keep posting new and awesome videos like this.
@EpicSaif2
@EpicSaif2 Месяц назад
This is ..... a work of art man 🤯
@JaviRelax
@JaviRelax 3 месяца назад
Such a clear way to explain complicated things, i really appreciate that! Such a great video! Thank You!
@usmankhalid9516
@usmankhalid9516 Месяц назад
good job Lun !
@charleyshiman4748
@charleyshiman4748 Месяц назад
This is just unbelievable. I am speechless
@shekharpal036
@shekharpal036 2 месяца назад
I appreciate the hardwork u must have done in order to be where you are today . I am just a beginner, but using your simple CSS it feels as if I am learning great things
@lundeveloper
@lundeveloper 2 месяца назад
Thank you brother, try hard together
@seralterego
@seralterego 28 дней назад
This is sooooo cool...great video man!
@DetectiveNoir_
@DetectiveNoir_ 3 месяца назад
This deserves millions of views
@lundeveloper
@lundeveloper 3 месяца назад
That is my dream
@kenbee85
@kenbee85 27 дней назад
I really love you explanation compare to others. For me as that one that English is not my first language, a visual graphic design really helped solidify my understanding.
@Yarkaha
@Yarkaha 3 месяца назад
You earned a subscription man!! This is epic keep doing it. 😂😂❤
@lundeveloper
@lundeveloper 3 месяца назад
😘😘😘
@flexpixels
@flexpixels 9 дней назад
Brilliant! 🙌
@ong.ghostly
@ong.ghostly 2 месяца назад
never thought i would ever hear mrbeast explain css for me
@Luis-xe8du
@Luis-xe8du 18 дней назад
Crazy design, what a nice guy, keep doing it!
@lundeveloper
@lundeveloper 18 дней назад
Thank you, I Will ❤️
@abhisheksingh-cn6vi
@abhisheksingh-cn6vi 2 месяца назад
The way u r explaining each line is really appericiate. ❤
@dacutananjoshuacaleb4203
@dacutananjoshuacaleb4203 3 месяца назад
yo this is crazy! keep up the content man I learned a lot very well explained, I subscribed. I hope you get a lot of subscribers you deserve!
@lundeveloper
@lundeveloper 3 месяца назад
Thank you so much brother
@janbures6445
@janbures6445 2 месяца назад
Very handy and nicely explained! Great job, keep it coming!
@lundeveloper
@lundeveloper 2 месяца назад
Thank you so much 😍
@jyjm
@jyjm 3 месяца назад
Waiting eagerly for the pt 2 with JS !! Amazing!
@lundeveloper
@lundeveloper 3 месяца назад
Its Comming..... 😍
@Khizar.design
@Khizar.design 2 месяца назад
Amazing...you took coding to another level.... Love the way you explain things.
@lundeveloper
@lundeveloper 2 месяца назад
Thank you so much 😍
@muhammadfurqanalam
@muhammadfurqanalam 4 дня назад
Subscribed 🎉❤
@fightflowwithcomedy3300
@fightflowwithcomedy3300 3 дня назад
amazing you are amazing lun developer
@manuelvaal1257
@manuelvaal1257 2 месяца назад
your voice made it easier to digest css. u are a legend.🤩
@lundeveloper
@lundeveloper 2 месяца назад
Thank you so much brother
@avoybaruah8061
@avoybaruah8061 2 месяца назад
i have been doing a similar project but this is the easy part to do main task is to stop a image when click and give the ability to the cursor to move the model everywhere they can
@Humayrahimu5
@Humayrahimu5 11 дней назад
very good 🎉🎉🎉
@that_80s_guy
@that_80s_guy Месяц назад
Awesome video!
@apaulolopes4497
@apaulolopes4497 Месяц назад
Thank you! This is amazing :) Liked, voted and subscribed!
@_Fancy_Bear_
@_Fancy_Bear_ Месяц назад
New inspiration has been found........ that's awesome...
@vishalk568
@vishalk568 2 месяца назад
Love from India ❤
@lundeveloper
@lundeveloper 2 месяца назад
Thank you, love India 😍😍
@rashidshahriar7913
@rashidshahriar7913 3 месяца назад
new css king in the town
@development8224
@development8224 Месяц назад
greattt videos!! thanks yout tutorial
@Br30357
@Br30357 2 месяца назад
I am amazed to see what can be done by just CSS only. You did a great job.
@lundeveloper
@lundeveloper 2 месяца назад
Thank you for watching my content ^^
@Br30357
@Br30357 2 месяца назад
@@lundeveloper No bro thankx for making such a beautiful innovative thing and sharing it with others. BTW thankx for your comment.
@ArtCraftTbscreation
@ArtCraftTbscreation 3 месяца назад
Mind blowing... I used to do this kind of enimation, with JS, but from now, I will try with CSS... Thanks... I hope will make more videos on these kind of effective css tricks
@cyberohn
@cyberohn 3 месяца назад
It'd actually be nice if instead of just creating individual variables and subtracting 1 from it, use a For Loop, which would start the iteration from 0, but vanilla CSS doesn't have a built in loop function unlike sass/scss. Either ways this is a really nice approach. You just earned my sub❤😌
@Brlitzkreig
@Brlitzkreig 3 месяца назад
Wow this is actually amazing content
@lundeveloper
@lundeveloper 3 месяца назад
Thank you so much bro ^^
@mabedinia4
@mabedinia4 2 месяца назад
wow that was great , i started my web design with wordpress now im reconsdring it 😂
@flash27s
@flash27s 20 дней назад
You are awesome, sir ❤️
@jimmyj.6792
@jimmyj.6792 2 месяца назад
Awesome presentation and explaination 🙏 so good and beautiful effect 🙂
@blazweindorfer
@blazweindorfer Месяц назад
This was amazing! pls do more stuff like this
@codigomix3403
@codigomix3403 2 месяца назад
I loved the content and code 👏
@lundeveloper
@lundeveloper 2 месяца назад
Thank you 😍
@ezaldensaifeldin9950
@ezaldensaifeldin9950 20 дней назад
Great job I liked it❤❤❤
@lundeveloper
@lundeveloper 20 дней назад
😍
@monisankarnath
@monisankarnath Месяц назад
Thanks man nice work
@BrandonSelby
@BrandonSelby Месяц назад
love it, I learned a lot of epic snippets of css
@vincentdubois1704
@vincentdubois1704 3 месяца назад
Thank you, more things like this without JavaScript.
@DebashisRoy-cs9qm
@DebashisRoy-cs9qm 2 месяца назад
Bro it was amazing Tutorial ❤🎉..I learned a lots...Thanks for this amazing one.......
@realiable
@realiable 2 месяца назад
U r awesome.. u made my thoughts and ideas on real practice.. u r genius bro🎉
@Medical-relaxTV
@Medical-relaxTV Месяц назад
On fact with css you can open infinity room of choice amazing
@Anonymous-yv3ey
@Anonymous-yv3ey 2 месяца назад
At 0:14 the eye glow effect and then cards aligned in an orbit is it video editing or did you do it with CSS??
@DanielAyioka
@DanielAyioka 3 месяца назад
Amazing work 👏
@bladexpixel1225
@bladexpixel1225 3 месяца назад
Incredible⚡
@sudharsteyn7147
@sudharsteyn7147 3 месяца назад
Cool bruh looks amazing
@lundeveloper
@lundeveloper 3 месяца назад
Thank you bro ❤️
@mohammedshafin4086
@mohammedshafin4086 2 месяца назад
Just Amazing
@lundeveloper
@lundeveloper 2 месяца назад
Thank you bro 😍
@smangansibande6362
@smangansibande6362 Месяц назад
Wow❤🎉
@phunguyen-developer
@phunguyen-developer 2 месяца назад
Đẳng cấp vl anh trai ơi Fk amazing video
@nadim-chowdhury
@nadim-chowdhury Месяц назад
amazing video
@satiros
@satiros 3 месяца назад
Pretty good and Nice. At the end i was kind of dizzy but it is interesting what You could do. Thx for sharing :)
@lundeveloper
@lundeveloper 3 месяца назад
😍😍
@baiomarlaye3165
@baiomarlaye3165 2 месяца назад
6:30 I didn't know you could create variables like that... of course ideally you prolly want to set the variable values using JS to make it even less hardcoded but real nice btw i know he did it that way cuz hes using css only
@veselinfilipov2649
@veselinfilipov2649 3 месяца назад
Found your channel today and it was a direct subscribe. Awesome content!
@lundeveloper
@lundeveloper 3 месяца назад
Thank you so much bro
@error_null6774
@error_null6774 2 месяца назад
Genius!!!!!! This is so genius that my thumbs feel like hitting on the subscribe button
@lundeveloper
@lundeveloper 2 месяца назад
So you haven't clicked subscribe yet? 😢😢😢😢😢
@error_null6774
@error_null6774 2 месяца назад
I subscribed!
@agungwiseso
@agungwiseso 3 месяца назад
One word for you, STUNNING
@strugglingElds
@strugglingElds 29 дней назад
True Monster!
@dav1_fer
@dav1_fer 3 месяца назад
Love this effect! Good content friend 👍
@lundeveloper
@lundeveloper 3 месяца назад
😍😍😍😍
@HiveSync
@HiveSync 3 месяца назад
You are beast in styling dear.
@Way_Of_The_Light
@Way_Of_The_Light 3 месяца назад
Holy cow!! You’re like the new Hyperperplexed 🔥✨ Please keep making epic CSS animations like these 🙏🙏 subscribed with notifications 🔔 🫡
@lucioluczka8752
@lucioluczka8752 2 месяца назад
This is absolutely marvelous
@lundeveloper
@lundeveloper 2 месяца назад
Thank you so much bro ^^
@nicolastovar3239
@nicolastovar3239 Месяц назад
Nice video, you are the best! Can you explain how to make the cards face forward instead of towards the axis they are rotating around?
@dripperukffk
@dripperukffk 2 месяца назад
OMG this is epic
@roshansmith6560
@roshansmith6560 3 дня назад
OMG mind-blowing Mathation code. Can you suggest us what kind of mathematic fo we need learn for 2d design and 3d design
@xavigrandes2711
@xavigrandes2711 3 месяца назад
Amazing content!! 🤩 thanks for share this knowledge, I've learned a lot
@lundeveloper
@lundeveloper 3 месяца назад
Thank you watch my content 😍😍
@heidardotdev
@heidardotdev 3 месяца назад
wow what a stunning and professional tutorial thanks my friend
@longlancer
@longlancer 2 месяца назад
This is just sick! Awesome.
@lilcranky9455
@lilcranky9455 2 месяца назад
fuuuuf you are so amazing!
@randeeprana5622
@randeeprana5622 3 месяца назад
Good content, Thanks for sharing please keep it up
@emmaofafrica
@emmaofafrica 2 месяца назад
Thanks for this amazing piece. I'll go try this out in WordPress
@rojasjahiker
@rojasjahiker 2 месяца назад
such an amazing video bro, i've learned a lot!
@lundeveloper
@lundeveloper 2 месяца назад
Thank you so much 😍
@thedarksterbhupi540
@thedarksterbhupi540 3 месяца назад
Actually CSS is really awesome 😍
@waseemgandapur1584
@waseemgandapur1584 2 месяца назад
That's great mrbeast❤
@stefanpisarov4016
@stefanpisarov4016 3 дня назад
Bro i love u and i guess its time to add that js for slider drag :D :D
Далее
Crazy 3D Rotation Effect Using CSS Only
7:40
Просмотров 143 тыс.
Play and Pause in Infinite Slider with CSS Only
13:24
Award Winning Animation With Only 20 Lines Of CSS?
6:59
Top 2024 Web Design Trends
5:32
Просмотров 608 тыс.
Reacting to 21 Design Portfolios in 22 Minutes
22:41
Просмотров 600 тыс.
Crazy CSS Using By Master CSS
6:46
Просмотров 156 тыс.
The Easy Way to Design Top Tier Websites
11:54
Просмотров 433 тыс.
Front-end web development is changing, quickly
3:43
Просмотров 1,1 млн
Amazing 3D Animation Website with Three.Js So Eazy
15:22
So, you want to build apps & websites?
9:34
Просмотров 184 тыс.