Basic Parallax Website With HTML & CSS

  Рет қаралды 440,669

Traversy Media

Traversy Media

Күн бұрын

Пікірлер: 662
@TraversyMedia
@TraversyMedia 7 жыл бұрын
Guys, this is a VERY basic implementation and is more of a "fixed scrolling" website. Maybe calling it Parallax is not the best description but whatever. Hope you enjoy it
@blakeyeboah393
@blakeyeboah393 7 жыл бұрын
Traversy Media Great video!
@Dxydrm
@Dxydrm 7 жыл бұрын
Yup, first impression was that this implemented fixed scrolling more than parallax, but it's good info regardless. Thanks man!
@Speedhaak
@Speedhaak 7 жыл бұрын
This is how I do all 'parallax' on our projects. It's a much lighter way of achieving the affect without bloating the project with too much code. Nice tutorial though, very clean and simple. :)
@diegoalbarracin5390
@diegoalbarracin5390 7 жыл бұрын
Thank you for this!
@leandrodossantos9160
@leandrodossantos9160 7 жыл бұрын
I just love your mentality man!
@EricNguyener
@EricNguyener 7 жыл бұрын
When you hear someone's voice for so long and finally see their face. It's like my mind just went to a whole different dimension trying to sync up your face and voice. In all seriousness, I actually think your Boston accent helps me learn so much more.
@sonalipanchbhai5189
@sonalipanchbhai5189 3 жыл бұрын
You don’t know how many times I have tried to understand the parallax concept but after watching your video I finally get it. It was really helpful. Thank you !
@noahjwhitmore
@noahjwhitmore 7 жыл бұрын
This is the most straightforward and simple overview of the parallax effect that I have ever seen... maybe even that I could imagine ever seeing. IMO, the key to why your videos are so helpful is that you keep the code as simple and clean as possible with minimal content in your examples. You don't try to make things flashy, so you keep bloat out of your markup (superfluous divs and spans) and your CSS has just the bare essentials of what you need to achieve the effect and keep it visually pleasing. Thank you for your focus on the task at hand, that's a great way to instruct. Thank you for these helpful tutorials!
@Cellohhh
@Cellohhh 2 жыл бұрын
Evergreen content right here! 5 years later and this is still helping people, thanks!
@MistaT44
@MistaT44 7 жыл бұрын
Man, I came over to my parents' for holidays and I'm up all-night binging on your videos and practicing them and its 6:20am right now. You are an absolute saint!
@darkprincess483
@darkprincess483 5 жыл бұрын
You don’t know how much you helped me with a school project I am working on through your tutorial ! Thank you , God bless you !
@samsoncooper1
@samsoncooper1 9 ай бұрын
Thanks, have been learning HTML and CSS for just under 3 weeks now. I honestly thought this would be so much more complicated than it is! Found several tutorials with no speaking on them but this was the first that explained what you were doing as you were doing it! Lovely for us beginners. Now to see if I can take this to the next level!
@PaulAnderson-ky8ne
@PaulAnderson-ky8ne 6 жыл бұрын
I've just found your channel and a beginner to HTML (as a mature gent from the UK), and I find your tutorial very, very interesting and useful. You explain things clearly. I am learning so much from you and I hope that you continue making your videos. I can not thank you enough for these fantastic videos and I hope to be able to learn much more from you. I think a donation is due. Thank you again.
@kuncelturtiz1088
@kuncelturtiz1088 3 жыл бұрын
I was thinking: I know this voice and now I realize I'm getting front end course from you. Great work man!
@SlayerDUDE1993
@SlayerDUDE1993 6 жыл бұрын
You know what, some time ago I downloaded your html+css playlist to watch it later on free time. I do it usually in case if yt-channels gonna have problems so I could access vids any time I need. Now I've got time to study and found your vids on my PC. I watched this video and decided to find it here on youtube again just to say thank you, hit like and subscribe. This is how it should be.
@JLudwigCruz
@JLudwigCruz 5 жыл бұрын
I currently have a stable job as an IT System Admin. I'm part of the Infrastructure team (Servers, Networks, etc. . ) I'm wanting to extend my knowledge and (maybe shift) my career to a web developer due to it's demand right now. And also to provide more income. I'm so Glad that I found out your channel! Thank you for the effort you put it in on your every videos, sharing knowledge and ideas. Plus your very honest and passionate about your work. I'm sure a lot of us gain confidence to achieve more learning because of your channel. Very helpful. Keep up the good work!!! :)
@boarnerges_olu3648
@boarnerges_olu3648 5 жыл бұрын
anywhere I see Traversy Media clip, I just open it up in the next tab; pending when I will watch because I must watch. You are a good teacher
@chrismachabee3128
@chrismachabee3128 5 жыл бұрын
I feel like I have sat at the foot of a master, and I can see at work. I have been one of your students for a few years now, and I never say you, only heard you. to watch you work is an inspiration to me and I'm sure it will help my coding. I listened to your history story, but How do you know about everything, you teach everything. Well, it seems like everything to me. Thank you. I'm not trying to get syrupy or anything I just appreciate you and what you do. you have crazy dedication to what you do. It's great. C'ya.
@blahblahblah2070
@blahblahblah2070 6 жыл бұрын
you helped me sooooooo much...cant stand most peoples voicemore than a min...dig the boston accent. and your pace is perfect for a person learning. your clear and natural...keep it up bro
@RoziOli
@RoziOli 6 жыл бұрын
OMG I've been looking for how to do paralex for about 2 hours now and your video showed me exactly how to do it.Thank you so much!!!
@kazudemruz0141
@kazudemruz0141 7 жыл бұрын
Dude you are so amazing! I thought I will never get how this works, cause I am new to html. You are the only one who did not only show the code to copy and paste. You actually teach what you are doing. thank you
@darkone3492
@darkone3492 3 жыл бұрын
This was such a great mini-project to try as a beginner. So simple yet so elegant!!
@muppetsg2
@muppetsg2 5 жыл бұрын
The best Tutorial about parallax website I found on YT.
@pascalquetin8110
@pascalquetin8110 6 жыл бұрын
I have enormously apreciated the content of the example, the simplicity of the demonstration and especially the clarity of the explanations. Another point, I am french and my english is average. Despite this problem, I fully understood the oral explanations. Thank you for this international tutorial.
@bobloblaw5105
@bobloblaw5105 7 жыл бұрын
Yo man, been watching your videos for 4 days straight. why is this so good??? what are you doing man? many thanks btw
@TraversyMedia
@TraversyMedia 7 жыл бұрын
Wow, that is frigging awesome. I don't know why its so good, I do my best to explain things in simple terms and do practical content
@xx482
@xx482 7 жыл бұрын
i also feel the same when i watch your videos, you make things pretty easy and understandable. Thanks @Traversy
@augre-app
@augre-app 7 жыл бұрын
i think a big thing about him is he starts from scratch. even john lindquist, another great teacher does this. that makes it very complete.
@hiryuimajin9883
@hiryuimajin9883 7 жыл бұрын
Traversy Media its crazy! Your like Ellen of web tutorials 😂😂😂😂😂 click baiting us and not giving us sleep haha. Tyvm
@corruptedusr
@corruptedusr 6 жыл бұрын
I'm just a beginner, but it's amazing how easy it is to create a simple, beautifully designed website. Thanks for that!
@omranashing
@omranashing 4 жыл бұрын
Hi I am a student from India. This guy is my god. thank you a lot for explaining everything step by step.
@andreaskeland523
@andreaskeland523 7 жыл бұрын
Okey - soooo..... One semester in - and you tought me more in 20 minutes and 47 seconds than our teacher did in 5 months. Subbed!
@ahmmadawshaf
@ahmmadawshaf 4 жыл бұрын
I started web dev just because of your videos man! Your videos are amazing
@juniormichaelseri5212
@juniormichaelseri5212 7 жыл бұрын
Thank you so much Brad! Many of us will owe our careers to your channel, its literally the best resource out there and you are such a cool guy. thank you for your efforts.
@pioleonardo
@pioleonardo 6 жыл бұрын
Thanks brad, I was so happy with the result that I laughed for the first time in 4 years. (I was hit by TB meningitis, brain got abscess and swelled). Thank you very much, I am a big fan of yours!
@hiryuimajin9883
@hiryuimajin9883 7 жыл бұрын
I dont care if its fixed scroll or parallax it looks great and very lightweight. Thank you for sharing your videos. I always watch the full ad for you 😂 I just want to say that I really like the lightweight and structured tutorial that you are giving. Tyvm
@suryaprasad3527
@suryaprasad3527 7 жыл бұрын
When it is comes to explaining in Simple terms, you are the best. You are awesome.
@NathanSmithRenown0
@NathanSmithRenown0 7 жыл бұрын
Excellent video as always! I'm glad to hear DevMountain is sponsoring you! I just graduated from there a couple months ago and I used your videos as extra study guides while I was there.
@scalemodelstudio
@scalemodelstudio 6 жыл бұрын
I'm starting to fall in love with Web Development because of your tutorials! thanks man!
@minako98501
@minako98501 5 жыл бұрын
I really appreciate how straightforward this tutorial was. I feel like I understand the basics of what's going on now, so that will make it easier to learn how to add more complexity to this technique in the future. I love your videos. Thanks for the great tutorials.
@sadiehunsinger9663
@sadiehunsinger9663 2 жыл бұрын
Beginner here! This was absolutely fantastic. I love all of your videos. Thank you so so much for your time and brain!
@vishwanathgajavelly6856
@vishwanathgajavelly6856 7 жыл бұрын
Wow, Brad! yet another amazing crash course. Have been following you for the past couple of months and you haven't disappointed me for a second even. One of the best things that had happened to me in my life is to find your channel, I'm turning out to be a great fan of yours; had already suggested your channel for way too many people. The way you speak, the way you present your content and the way you respond to comments are all awesome. Never be worried about some bugs in the society, they are just those bugs who keep us grounded and I'm pretty sure, even they'll eventually turn out to be your fans if they follow you for a couple of courses(no matter which, all your courses are awesome). If you concentrate on your content (which you always do), you need not be worried about the money, they'll eventually come without your efforts. Keep doing the great job brother. Stay motivated, stay blessed!
@TraversyMedia
@TraversyMedia 7 жыл бұрын
Thanks friend. That's really good to hear and very motivational. All content creators have to deal with those bugs which is unfortunate but the good dramatically overwhelm the bad. I may speak on it but I would never let them deter me. I really appreciate your support
@kleva123456
@kleva123456 3 жыл бұрын
Extremely simple and the site looks like a spaceship. Kudos. Using this in my next project
@davidmclean4470
@davidmclean4470 7 жыл бұрын
Thank you so much for your videos. I live and work and france and learned web design and development a few years ago and found it hard to learn modern website techniques. I'm using the knowledge from these tutorials to build a new portfolio. Again I wouldnt be able to work in the industry without having you Jedi masters to mentor people like me. Keep up the good work.
@MrWyldWolf
@MrWyldWolf 7 жыл бұрын
I just got my degree in web development but learning new things every day. I really liked how you explained it out, step-by-step. Great video. Subbed today.
@borisbosnjak9772
@borisbosnjak9772 5 жыл бұрын
Thank you so much for this! I'm so happy rn...Parallax was the only thing I needed to complete my first webpage with over 600 lines of code :D
@brzdude06
@brzdude06 7 жыл бұрын
I'm a simple man. I see a Brad video, I click the like button. :) Tks for always putting up such great content, my friend. I intend to buy your Udemy course soon.
@VideoServicesLI
@VideoServicesLI 7 жыл бұрын
Brad, Thanks for another great 'how to' video. Please keep 'em coming. Learning how to code at...60 ! After 40 years in construction, my body is worn out, I have to make a career change into something less physical. It's (coding) certainly not easy, I've been playing with computers since Radio Shack put out it's model 3. I'm currently enrolled in a bootcamp as well. Your videos have been very helpful. You're better than some of the mentors I've had. Good job!
@williamshakespeare2482
@williamshakespeare2482 7 жыл бұрын
I know just how you feel @Rich L. I'm 51 and getting back into coding. Been a few years since the TRS-80 days LOL. I learned Microsoft Basic on an Ohio Scientific C1P and then taught myself assembly code on the 6502 / 6510 with the C-64. Ahhh such memories.
@christianpaulfuentes204
@christianpaulfuentes204 7 жыл бұрын
Because of you, I will be like you someday. You're the best man. Thanks for all the videos..
@Jawmeow
@Jawmeow 6 жыл бұрын
Oh my god I just did it and you can't imagine how happy I am now, thank you so much! It's all much appreciated!
@Jawmeow
@Jawmeow 6 жыл бұрын
and oh I disable my adblock just when I watch your videos. Keep up the good work and be certain that a lot of people appreciate your knowledge sharing and invested time!
@shahidshaikh5961
@shahidshaikh5961 2 жыл бұрын
I am very happy to reachout to this awesomevideo... there are few people who actually brings a nice content with the excellent explanation!! Thanks sir !! 😊
@kekuleh1
@kekuleh1 6 жыл бұрын
done with this tutorial. i'm going through the HTML & CSS playlist 1 video per day. Thanks for the tutorial!
@markclark3928
@markclark3928 7 жыл бұрын
I have watched and followed along to quite a few of your videos and enjoy learning new techniques from this one as much as the others. Thanks!
@lloydthomas4481
@lloydthomas4481 5 жыл бұрын
Tried to figure this out on my own the other day and over complicated it. Thank you for yet another, simple and effective tutorial.
@iTomAnks
@iTomAnks 7 жыл бұрын
Been wondering how this style of website is done - thanks!
@douglasdcc
@douglasdcc 4 жыл бұрын
I know this is a 2017 video but this is an awesome work man!!! Congratulations
@MrDimitri71
@MrDimitri71 7 жыл бұрын
I'm starting to learn HTML and love your videos. Keep up the good work, cheers from Brazil
@MrPogi-lf5gz
@MrPogi-lf5gz 7 жыл бұрын
Good to see you for the first time! Thank you for all your videos.
@cr3amyn3ll66
@cr3amyn3ll66 3 жыл бұрын
Thank you very much, I tried to create a parallax website myself and it worked but the html was very confusing and adding stuff or changing it was very hard. Your code is much better and thank you very very much!!!
@lindajohnson7463
@lindajohnson7463 4 жыл бұрын
This was the very best explanation I have found. Thanks for your generosity.
@medicalostrich7775
@medicalostrich7775 7 жыл бұрын
Cheers Brad, thanks for adding the part about mobile friendly 'scroll' on the background-attachment. Really useful tutorial. Have subscribed and will be coming back for more....
@RonaldoGazel
@RonaldoGazel 6 жыл бұрын
Man, theses classes are SO amazing, I´m learning as easy as never before.
@ernestapedo5378
@ernestapedo5378 7 жыл бұрын
First time seeing your face. You are truly a PRO. Thanks a lot for your wonderful content deliveries.
@TraversyMedia
@TraversyMedia 7 жыл бұрын
Thanks, I appreciate that :)
@infotakeaway2641
@infotakeaway2641 7 жыл бұрын
I love this guy... Why don't I have a teacher like him in my uni ?☺ 😁
@youtubelearner5782
@youtubelearner5782 7 жыл бұрын
U r good teacher quality ....easy to understand the way u taught us
@chrisduester2468
@chrisduester2468 6 жыл бұрын
Thanks for this clear, simple, accessible tutorial. This is the 3rd video of yours that I've implemented with my web design class.
@hippigypsi
@hippigypsi 7 жыл бұрын
Wow, had no idea it was that easy. Thanks again Brad!
@goopy303
@goopy303 7 жыл бұрын
My new favorite Programming KZbinr! Quality content!!
@markolivancic
@markolivancic 7 жыл бұрын
As always, awesome and simple. Subbed few weeks ago, still enjoying your uploads man. Awesome work. Cheers.
@nagahumanbeingzooofparticl8836
@nagahumanbeingzooofparticl8836 6 жыл бұрын
feels so proud as a beginner to complete this kind of project.. Thank you Brad. awesome work.
@brianonyt1
@brianonyt1 7 жыл бұрын
Brad, your videos are amazing. I feel like I've learned more in a week than I did in all of last year. Your explanations are extremely concise and practical. I especially enjoyed your Web Development in 2017 Guide video. Keep up the great work!
@Lyynnx-025
@Lyynnx-025 3 жыл бұрын
Thank you for this! I used your video as a reference for my school project!
@connorocampo
@connorocampo 7 жыл бұрын
Thanks so much man! Newbie here in to coding game and this was quick and painless! You've got another sub :)
@syedusmanahmed
@syedusmanahmed 7 жыл бұрын
It was a mystery for me. You solved it. Thanks.
@Jakhongir84
@Jakhongir84 7 жыл бұрын
Man, you are awesome. Cant thank you enough for what you do. I wanna be like u someday.
@easysites9129
@easysites9129 6 жыл бұрын
so right
@easysites9129
@easysites9129 6 жыл бұрын
coding is difficult but you really help me out. thanks
@EOrtiz
@EOrtiz 3 жыл бұрын
Dude, so glad I found your channel! Learning a lot! Thanks for sharing
@zoasis7805
@zoasis7805 7 жыл бұрын
So much good variety on your channel. Thanks man
@andrewreese2861
@andrewreese2861 7 жыл бұрын
Brad, you are the man. Thank you for posting so many awesome videos. They are very helpful.
@asifiqbal3733
@asifiqbal3733 7 жыл бұрын
This is my first comment in youtube. Your video is extremely great.Thanks man......
@TraversyMedia
@TraversyMedia 7 жыл бұрын
Thank you friend. I appreciate that :)
@alialsubaie8529
@alialsubaie8529 7 жыл бұрын
You have no idea how glad I am to find out about your channel. Thank you so much for the quality content you provide. I have a request for you. If you can make a video (or couple of videos) of how to make a logo, you'll do me (and I'm sure others too) a huge favor. How to start creating a meaningful and symbolic logo design?
@Alaiik
@Alaiik 6 жыл бұрын
Fantastic! I'm trying to make a site to host my digital portfolio, and your videos have been a tremendous help. Thank you.
@nutanpanta9238
@nutanpanta9238 5 жыл бұрын
Thank u sir helped me a lot in my project.Just found your channel and i already started loving your videos..
@Burdjur
@Burdjur 7 жыл бұрын
Would be really cool if you could add to this video with another one where you go through the process of making a fixed sitemap of sorts, where you can click to navigate between the different sections and/or images. Thanks a lot for this video regardless, I'm new to this and you're really helping me out on this journey Brad.
@abraribnaalam5508
@abraribnaalam5508 7 жыл бұрын
Traversy Media is making life easier!! Thanks a loot!! Keep it up plss!!
@blankettheory
@blankettheory 4 жыл бұрын
Smooth! You made it really easy to follow along with
@raducostache8342
@raducostache8342 6 жыл бұрын
I love you man! Your videos, especially practical examples like this are freaking awesome, keep doing them! I started learning web development a month ago from zero and your channel has been a huge help.
@obeondo
@obeondo 5 жыл бұрын
Hi! Been trying to find a parallax tutorial for my project and this one really helped A LOT (and i can't stress that enough) thank you so much! Much love and support!
@shazzamconsta7325
@shazzamconsta7325 4 жыл бұрын
Thanx a zillion from Australia! and for the links and code. Excellent tutorial, will be watching more. Will donate if I can get a job! : )
@wilfredomendez3450
@wilfredomendez3450 7 жыл бұрын
Clear, conscience and to the point, thank you so much for another great tutorial.
@ThePiiKey
@ThePiiKey 6 жыл бұрын
Love you man, greetings from Czech Republic
@JustLookA7
@JustLookA7 6 жыл бұрын
Best content on KZbin.
@RileyDu
@RileyDu 7 жыл бұрын
I watch every single one of your videos! Awesome and useful information !!
@nazsnet
@nazsnet 7 жыл бұрын
Great tutorial. I like your style. Straight-forward.
@Dantxxxx714
@Dantxxxx714 6 жыл бұрын
omg dude, just subbed.. that was fast and simple you rock
@doingsneakypeakylike
@doingsneakypeakylike 7 жыл бұрын
i always wondered how they made this kind of website. turns out now i can too! Thank you very much!
@prakad97
@prakad97 7 жыл бұрын
just don't stop making videos..your knowledge is more useful..thanks for these vids..since I am student can't donate..any Udemy course or anything that I could pay and learn that way I can tell the thanks...
@nextgen8888
@nextgen8888 6 жыл бұрын
Wow. So much more simple than it seems. background-attachment: fixed;
@Eufrejm
@Eufrejm 7 жыл бұрын
Hey Brad. Love the videos, and have been a subscriber for a while now. Thanks for all the free videos you do for us on KZbin, I appreciate it a lot. Will you do something like a video on setting up a dev environment using Vagrant?
@TraversyMedia
@TraversyMedia 7 жыл бұрын
I am looking into Vagrant and Docker now actually. May be a while but yes I will be doing it at some point
@Eufrejm
@Eufrejm 7 жыл бұрын
Tnx Brad keep up the good work!
@kylewalker2949
@kylewalker2949 7 жыл бұрын
I would be quite willing to help with a video on deploying and using Docker. I have been testing and building an on-prem cluster at work for the past few weeks and learning the insides and outs.
@TraversyMedia
@TraversyMedia 7 жыл бұрын
That may be an option Kyle because it is confusing the hell out of me :)
@nama-stay4565
@nama-stay4565 6 жыл бұрын
Man your codes helped me alot in my projects! thanks dude!
@ajmlyons
@ajmlyons 6 жыл бұрын
Your channel is a tremendous help. Great work brother!
@hangoutwithsid
@hangoutwithsid 6 жыл бұрын
Just can't tell you ,how easy you made it for me...Just made my day... Ttttthank alot...Buddy keep the great work.. Subscribed.👍
@fahadhafeez8086
@fahadhafeez8086 4 жыл бұрын
I thought you are using parallex.js. 67 lines of code .Welldone You are awesome
@kimberlyvillarmente8239
@kimberlyvillarmente8239 4 жыл бұрын
How I wish I saw this video earlier. Thank you once again ! you're a life saver
@GmoneyMozart
@GmoneyMozart 7 жыл бұрын
You're on your way bro. Love seeing that sub count rise. You deserve it. Keep it up!
@TraversyMedia
@TraversyMedia 7 жыл бұрын
Thanks man, I appreciate that
@paulsheldon5372
@paulsheldon5372 7 жыл бұрын
really is incredible. wasn't 2-3 months ago it was
@rifatahmed4659
@rifatahmed4659 6 жыл бұрын
Thanks Brad.. Bro i've learned lots of things from. You'r my mentor ;)... I am really honoured to have such mentor 👍👍👍
@nickpaul5080
@nickpaul5080 5 жыл бұрын
Keep 'em coming Brad! Thanks for all your help.
@fatemerahmanabadi5685
@fatemerahmanabadi5685 7 жыл бұрын
This is so beautiful. Thanks brad. You're a rock star. Your channel as fun as Breaking Bad. You're a great teacher :)
This Simple Trick Makes Your Website 83% Better Looking
10:57
Web Dev Simplified
Рет қаралды 400 М.
Responsive HTML & CSS Side Menu From Scratch
23:57
Traversy Media
Рет қаралды 397 М.
-5+3은 뭔가요? 📚 #shorts
0:19
5 분 Tricks
Рет қаралды 13 МЛН
БОЙКАЛАР| bayGUYS | 27 шығарылым
28:49
bayGUYS
Рет қаралды 1,1 МЛН
Flexbox CSS In 20 Minutes
19:59
Traversy Media
Рет қаралды 1,8 МЛН
HTML & CSS Easy Elegant Landing Page With Blur Effect
34:43
Traversy Media
Рет қаралды 154 М.
True parallax with CSS-only is now possible
17:32
Kevin Powell
Рет қаралды 245 М.
Pure CSS Hamburger Menu & Overlay
35:47
Traversy Media
Рет қаралды 399 М.
Bootstrap Beginner Crash Course
1:13:27
Traversy Media
Рет қаралды 1 МЛН
HTML Crash Course For Absolute Beginners
1:00:42
Traversy Media
Рет қаралды 7 МЛН
CSS Grid Changes EVERYTHING - Amazing Presentation
32:06
Coding Tech
Рет қаралды 1,1 МЛН
CSS Crash Course For Absolute Beginners
1:25:11
Traversy Media
Рет қаралды 4,5 МЛН
Simple Pure CSS Parallax Scroll Tutorial
26:36
Developer Filip
Рет қаралды 71 М.
Learn Accessibility - Full a11y Tutorial
1:33:06
freeCodeCamp.org
Рет қаралды 78 М.