Тёмный
Conor Bailey
Conor Bailey
Conor Bailey
Подписаться
Software development, Electronic music production and drumming
Vanilla JavaScript Snapping Slider
37:18
3 месяца назад
Introduction to PostgreSQL
30:29
3 месяца назад
JavaScript Particles Animation on Mouse Move
35:56
6 месяцев назад
TypeScript: Animated Landing Page
1:14:01
Год назад
JavaScript Pixelated Menu Effect
40:16
Год назад
JavaScript Webpage Minimap
25:32
Год назад
Vanilla JavaScript: Masonry Grid Layout
42:37
2 года назад
Комментарии
@lucilalico8852
@lucilalico8852 5 дней назад
That's nice one. Can you explain me one thing? It loads anytime I'm going to home page , supposed to load once, Can't find solution for this.
@Rick24056
@Rick24056 16 дней назад
FINALLY
@mariobaq117
@mariobaq117 19 дней назад
thank you for the tutorial, it works great! I have a question: What happens if the scroll container is not 100vh but has a static height like 500px? Is it possible?
@ashifurrahaman8926
@ashifurrahaman8926 20 дней назад
top :0 not working after smooth scroll by lerp function, any help will be appreciated
@ShamynBabumh-yj5ck
@ShamynBabumh-yj5ck 21 день назад
ejactly what i was looking for
@deankinyua2365
@deankinyua2365 21 день назад
thank you, i Encourage you to continue😅
@stevemurphy5709
@stevemurphy5709 23 дня назад
Great content, thanks!
@TarikulIslam-nj7vr
@TarikulIslam-nj7vr 26 дней назад
Thank you..... Its working 😊
@ob5804
@ob5804 26 дней назад
How to make the .sticky block have the width of the content in the .scroll__section block? I have 6 images .sticky__parent { height: 600vh; } scroll__section { height: 100%; width: 600vw; display: flex; /* justify-content: space-between; */ align-items: center; gap: 50px; } img { width: 400px; height: 80%; object-fit: cover; object-position: center; }
@WorshipMinistryTraining
@WorshipMinistryTraining 27 дней назад
Can I make it one word at a time, instead of one character at a time?
@prestonxgvcci6697
@prestonxgvcci6697 27 дней назад
Wow why didn't I encounter this channel early.. that is some premium content bro good work !!
@vredchasing8926
@vredchasing8926 27 дней назад
Why doesnt the effect work on mobile? Don't understand why it wouldnt work on mobile.
@ConorBailey
@ConorBailey 27 дней назад
@@vredchasing8926 because the viewport on mobile devices changes on scroll in different directions so makes it appear app janky. I have figure this out though and made a mobile friendly version recently. ru-vid.com/video/%D0%B2%D0%B8%D0%B4%D0%B5%D0%BE-p43Sv6O0IYQ.htmlsi=TIaVTbqEWeT2fFH4
@vredchasing8926
@vredchasing8926 26 дней назад
@@ConorBailey I watched your one video on a horizontal scroller effect. ru-vid.com/video/%D0%B2%D0%B8%D0%B4%D0%B5%D0%BE-yXnK8ND76z8.html&ab_channel=ConorBailey My question is, is this approach considered wrong? These are different scenarios, but is this approach still good ? I'm learning to get a job, not sure if I learnt a "bad" way to do it.
@LuisDa20
@LuisDa20 28 дней назад
this has some problems, if you add a navbar with link tags and hashtag for the section like #section, when you click, don't scroll to the section, also you can put another element with position fixed inside this container, that put a limit on the design
@ConorBailey
@ConorBailey 28 дней назад
@@LuisDa20 yeah you have to use js in this scenario to calculate the offsetTop property of the relevant section you wish to scroll too.
@user-nt8nh7bl3c
@user-nt8nh7bl3c 29 дней назад
where does span added in html
@sunriseinthesky3710
@sunriseinthesky3710 29 дней назад
So cool! I learned a lot about smooth scrolling ! Thanks! Have a good day!
@owentobias21
@owentobias21 Месяц назад
its a very good approach, but wouldnt it be better if the height follow the content inside instead of being defined from the beginning?
@NomanAli-zd1bn
@NomanAli-zd1bn Месяц назад
I really like all of your video please like us beginners can you make Javascript tutorials
@ConorBailey
@ConorBailey Месяц назад
Hi mate. Thanks for your comment. Yes I will be posting a full course soon which will cover the JavaScript fundamentals. I will also be creating a full website with it it with some cool animations using pure vanilla JavaScript. Thanks for your support!
@NomanAli-zd1bn
@NomanAli-zd1bn Месяц назад
@@ConorBailey thank you much I am self taught graphic designer started learning web there is one website where when you hover over text on any element it shows elements in mask I hope you will cover this too I would love to learn from you thanks
@Tony.Nguyen137
@Tony.Nguyen137 Месяц назад
This is what i was looking for❤thank you
@adaferraramirenzi3269
@adaferraramirenzi3269 Месяц назад
and if i use image that are in my folder howi can do it?
@hafizulfitri5546
@hafizulfitri5546 Месяц назад
This is very creative. Clear tutorial.
@lnard0
@lnard0 Месяц назад
Thanks for this!
@Arjunkrm2003
@Arjunkrm2003 Месяц назад
where can i get source code
@stephanieegbuonu2626
@stephanieegbuonu2626 2 месяца назад
super cool video, thanks.
@stephanieegbuonu2626
@stephanieegbuonu2626 2 месяца назад
Great tutorial!
@diptyque273
@diptyque273 2 месяца назад
Hi! Thank you so much for the great work ❤ I'd like to know how to add more images to project slider, guess I need to edit the javascript code 'animateProjects()' but have no clue!
@igdagusryankurniantara1053
@igdagusryankurniantara1053 2 месяца назад
can we access camera from phone ?
@amanuelabiy7077
@amanuelabiy7077 2 месяца назад
This was really helpful, thank you very much.
@Yasir-dev
@Yasir-dev 2 месяца назад
Provide source code
@byeolshe
@byeolshe 2 месяца назад
how to add a link to the images?
@ConorBailey
@ConorBailey 2 месяца назад
Wrap them in a <a> tag
@prk8739
@prk8739 2 месяца назад
thanks, you're hero
@blackrandall
@blackrandall 2 месяца назад
Belly belly good....they see me scrolling 😎😎
@_ademmeral
@_ademmeral 2 месяца назад
u'v gotten a new subscriber, bro. Continue on this kinda videoz :))
@_ademmeral
@_ademmeral 2 месяца назад
great <3
@paulehrig6414
@paulehrig6414 2 месяца назад
Thx Conor, Another excellent video & narration with a lot of value. Your time is very appreciated!
@ConorBailey
@ConorBailey 2 месяца назад
Thanks mate! Appreciate your support
@Odessainfo541
@Odessainfo541 2 месяца назад
Thank you so much for such valuable content! I am learning from your videos and really appreciate them and your labor. Thank you! If you will have a chance, could you take a look on Aristide Benoist portfolio? There are pretty interesting solutions that would be interesting to break down
@Pavel-wj7gy
@Pavel-wj7gy 2 месяца назад
You published a project that only worked for 3 years or so. As of now, even if I clone your repo, it doesn't show images nor does it scroll.
@ConorBailey
@ConorBailey 2 месяца назад
Are you running the project with parcel? Should still work…
@namtran26803
@namtran26803 2 месяца назад
another way to make mans grid layout in CSS is: .div(container) { width: (of your choice); columns: 4; columns-gap: 20px; }
@ratasobreviviendoenlascloa4847
@ratasobreviviendoenlascloa4847 27 дней назад
so bad.
@Zinab8850
@Zinab8850 2 месяца назад
thanks man🤩
@oussamaoutazari9144
@oussamaoutazari9144 2 месяца назад
can you do it on scoll instead of grabing it
@oussamaoutazari9144
@oussamaoutazari9144 2 месяца назад
you deserve an award for teaching us in this amazing this videos.. Thank you
@ConorBailey
@ConorBailey 2 месяца назад
Thanks mate. Appreciate your support! 🫡
@tonysingh5334
@tonysingh5334 2 месяца назад
I think rauno has some great ideas that need some explaining
@ConorBailey
@ConorBailey 2 месяца назад
Never heard of Rauno before now. Just checked out his Twitter and he shares some interesting stuff! Thanks for sharing!
@ww-zo2yl
@ww-zo2yl 2 месяца назад
I'm learning from your videos. Thank you as always. I appreciate it.
@gaurav5864
@gaurav5864 2 месяца назад
Thanks for another video Conor ❤ Hope you make more videos on recreating awwwards website with plain JavaScript
@ConorBailey
@ConorBailey 2 месяца назад
Thanks Gaurav. I will do. Always keep an eye out for awwwards. Let me know if there’s anything you would like me to cover. 👍
@gaurav5864
@gaurav5864 2 месяца назад
@@ConorBailey would be cool if you could explain how the vertical line on scroll animation works in the GitHub landing page. As we scroll down the elements appears with the vertical line on the left side that grows as we scroll down
@ConorBailey
@ConorBailey 2 месяца назад
@@gaurav5864 I’ll look in to it mate.
@ralphy1054
@ralphy1054 3 месяца назад
This isn't working for me, even after listening to the other comments' advice by disabling all my firewalls (domain firewall, private network firewall, public network firewall). While running a web server, attempting to connect to my external ip address from any other device still results in the standard can't connect error
@atronstechnologies
@atronstechnologies 3 месяца назад
What about for doing forgot ppassword?
@atronstechnologies
@atronstechnologies 3 месяца назад
Nice Conor. But when i click register after feiling all fill the routing is load and don't finish and the data isnot insert to the database. what is the problem will be?
@ShifaAfreenSiddiqui
@ShifaAfreenSiddiqui 3 месяца назад
@Conor Bailey, I hope you will be able to assist me in the pool.query you created in the server.js, where when you create the call back function to check for the already registered users in the if condition statement: 'if.results.rows.length>0). I did all the checks with you until then. However in that specific check, my application is crashing due to run-time error. I've been stuck at it all day not being able to figure out what actually is the problem. I hope you would be able to help me...
@ShifaAfreenSiddiqui
@ShifaAfreenSiddiqui 3 месяца назад
Infact after the callback function for console.log(results.rows), the application crashes in that very first check.
@ConorBailey
@ConorBailey 3 месяца назад
Hey shifa. Sure . Is your code hosted anywhere? I’ll take a look!
@ConorBailey
@ConorBailey 3 месяца назад
Also, can you please post the full error message? Thanks
@osamaayub6004
@osamaayub6004 3 месяца назад
its giving error giving can anyone tell how to remove this error Cross-Origin-Opener-Policy policy would block the window.closed call.
@seankennelly2984
@seankennelly2984 3 месяца назад
Excellent, really helpful and easy to follow! I'm glad you left some mistakes in the video as they gave a chance for me to check my code and find them myself
@enitan2002
@enitan2002 3 месяца назад
What about if your project has authentication like NextAuth, doesn't authenticate on the mobile