Parallax image backgrounds, gradients, and video backgrounds

Поделиться
HTML-код
  • Опубликовано: 31 дек 2024

Комментарии • 80

  • @30888316413
    @30888316413 4 года назад +97

    These are honestly so entertaining that I would them just for fun even if I wasn't learning Webflow

  • @barbancha
    @barbancha 4 года назад +51

    This are the best tutorial I ever saw on internet 😻😻

    • @Webflow
      @Webflow  4 года назад +2

      Thank you for your kind words, Alexandre Afonso!

  • @tonidebcn
    @tonidebcn 4 года назад +24

    This new kind of tutorials are SO SO MUCH BETTER than the old ones. It’s like I’m learning web design, not just the tool that sometimes may be overwhelming for the newbies. And this is what really matters. I just find the old videos dated because now I’m more consciously learning. The examples do stimulate my imagination, and that’s what I didn’t know I needed. You just need to marry me, and that would be all.

  • @flyingbrokenarrow
    @flyingbrokenarrow 4 года назад +3

    Webflow tutorial videos are the gold standard of tutorial videos and should receive an Oscar for the best tutorial videos from the Academy of Motion Picture Arts, Sciences and Tutorial Videos.

  • @tonykey6453
    @tonykey6453 2 года назад +1

    This should spawn somekind of show. Probably THE best tutorial videos I've seen from any product. Love the way this guy talks and the humour is bang on point.

  • @olehansen6568
    @olehansen6568 4 года назад +3

    Eventhough I know most of the stuff in these quick tutorials I never miss the chance to watch them as there are always some small (or big) nuggets to discover and learn about. Great work Webflow.

  • @Webflow
    @Webflow  4 года назад +1

    *CONTENT WARNING at 01:23 - this section may affect people with visual sensitivities. Viewer discretion is advised.

  • @knownoversight
    @knownoversight 4 года назад +1

    Just started using Weblow, literally a couple of hours ago, so this is the first tut video I've watched...and I have to say this is the first tut video I've ever laughed at, out loud.. And, it's the first tut video I want to share with friends.
    Bravo guys, what a great way to provide help and guidance.

  • @paulrodriguez2177
    @paulrodriguez2177 4 года назад +27

    You guys should be making tutorial for everything. I'm not even learning Webflow at this time but I love these! 😂😂😂

  • @strathmckay5347
    @strathmckay5347 3 года назад +4

    Man these are so good! The perfect mix of humour and clear explanation.

  • @aristotendudi7648
    @aristotendudi7648 7 месяцев назад

    Always happy to watch your tutorial , always fun and easy to understand you're the best

  • @ysteinWangen
    @ysteinWangen 4 года назад +18

    I never turn on the notification bell, except I do, except I don't, but when I do, it's Webflow.

  • @podsmacked
    @podsmacked 3 года назад +1

    I actually really appreciate the Stacks tip! I completely forgot about that

  • @russianguy831
    @russianguy831 4 года назад +2

    Thank you for your amazing tutorials! You make lives of thousands people so much easier! I can honestly say that this website builder platform is revolutionary, keep up the good work!

  • @ErikHill1
    @ErikHill1 3 года назад

    Hands down, best tutorial videos everrrrr

  • @elementsessence7368
    @elementsessence7368 3 года назад

    I love your tutorials. This guy is as dull & dry as he is hilarious!! Great job! And your COPY - OMG!!!! The best

  • @SinaNouri21
    @SinaNouri21 3 года назад +1

    These tutorials start so goood :)))) and funny btw
    That's why I'm so excited to watch webflow tutorials every day 😂😂

  • @wh1tecl0ud
    @wh1tecl0ud 4 года назад +1

    I laugh over every lesson, I love you, man

  • @shubhamparekh9808
    @shubhamparekh9808 4 года назад +9

    I'm eagerly waiting for the e-commerce

    • @swaggerbauer
      @swaggerbauer 4 года назад +1

      yeah.. need to build a mini shop soon...

  • @54CFL
    @54CFL 3 года назад

    I love you guys! Webflow is a gamechanger

  • @gdsigner1212
    @gdsigner1212 Год назад

    Your videos are unique.

  • @GrifanoRide
    @GrifanoRide 3 года назад

    Amazing Webflow, with amazing funny and helpful videos)

  • @ChrisWittusen
    @ChrisWittusen 2 года назад

    Great video and great humor

  • @Enzocol89
    @Enzocol89 4 года назад +7

    This guy is so damn hilarious 😂 😆 If this videos wouldn't be this much helpful I would just watch them for the jokes.
    Keep going the good stuff Webflow 👌🏻

  • @LukasNiebel
    @LukasNiebel 3 года назад

    Haha great script, very well delivered and clear instructions. Keep up the great work guys 👍🏻

  • @dudedamnit
    @dudedamnit 4 года назад +1

    I love this tutorials so much!

  • @dian.romanenko
    @dian.romanenko 10 месяцев назад

    Thank you for the video! What size of the background image you can recommend? If I create the image on my own and can choose the size of canva ✨

  • @sidneywong4816
    @sidneywong4816 11 месяцев назад

    For the text image background (photography in the video), how to make it same background color with its parent section background color, while just the texts is transparent and overlay on the fixed background image?

  • @solisinvictus4238
    @solisinvictus4238 4 года назад

    THESE TUTS ARE AWESOME!!!

  • @aliagha5827
    @aliagha5827 2 года назад

    I like how this is actually funny. :)

  • @maximilianardenius2450
    @maximilianardenius2450 10 месяцев назад

    Is this Ryan Renolds long lost brother? :O Love the tutorial!

  • @infiltretor287
    @infiltretor287 4 года назад

    I LOVE this channel!!!

  • @miltonsarkar5024
    @miltonsarkar5024 4 года назад +2

    Please make a video on how to autoplay video when its scrolls into view like facebook

  • @balloonartisan
    @balloonartisan 2 года назад

    🤣🤣🤣 hahaha... one of your best ones yet! I LOVE these!

  • @anetaroubickova8908
    @anetaroubickova8908 2 года назад

    Love these tutorials! Just a quick question: Is it possible to play video on scroll? Or it has to be a lottie?

  • @markb.8460
    @markb.8460 4 года назад +1

    q. why is the default tile? are people using it more often?

    • @markb.8460
      @markb.8460 4 года назад

      is that ux advice?am i working for free? is this a simulation?

  • @KateCatalena-hw9nj
    @KateCatalena-hw9nj 7 месяцев назад

    how are these so funny. the diamonds part killed me

  • @timmyhenrikssons
    @timmyhenrikssons 2 года назад

    The upload video function is gone (?) and now you have to embed videos?

  • @xed7188
    @xed7188 2 года назад

    When I use Background Video to upload animation in mp4, the color has changed a lot. I don’t know what caused it. It’s the same with webm. How can I solve it?

  • @asagoldstein1669
    @asagoldstein1669 4 года назад

    What do we do about Safari completely butchering fixed backgrounds? I have to avoid or just layer fixed Div blocks which is a pain.

  • @Caden_Burleson
    @Caden_Burleson 2 года назад

    Why is my linear gradient background tiling itself though?

  • @jaredslaybaugh6856
    @jaredslaybaugh6856 3 года назад +1

    Can you address that fixed backgrounds don't work on mobile?

    • @Webflow
      @Webflow  3 года назад +1

      Hi Jared! Thank you so much for asking! Fixed background images take up a lot of rendering power on mobile or touch screen devices, which can cause a jarring scroll experience.
      An alternative solution is to use fixed positioning for image elements within a relative parent.
      Here's a workaround shared within the community: discourse.webflow.com/t/trouble-with-fixed-background-images-not-remaining-fixed-on-touch-screen-devices/26733/4?u=waldo

  • @RobertTrew
    @RobertTrew 3 года назад

    Why still no options for stop and play on the BG video element?

    • @Webflow
      @Webflow  3 года назад

      That is actually possible. Stay tuned for a lesson on that here in the future.

  • @garyvoigt321
    @garyvoigt321 4 года назад

    I watch these for pleasure and entertainment.

  • @oskrm
    @oskrm 3 года назад

    When are we getting the Diamonds lesson? it's been 4 months!

  • @bennyd47
    @bennyd47 4 года назад

    Great content as always! It's missing mobile completely though - fixed backgrounds & videos are two of the biggest "gotchas" when transitioning your site to mobile browsers, and this video didn't even mention mobile 😬

    • @Webflow
      @Webflow  4 года назад +2

      Hi, bendrexl! Thanks so much for your kind words and your feedback.
      The article on Background videos is getting updated to match a lot of these gotchas. As seen at 7:27 in this lesson, this'll ensure everyone can get the most up-to-date information about how background videos behave on different devices (between iOS and Android updates, playsinline behavior seems to change every five minutes!).
      As for mobile, please stay tuned...we're working on something big for responsive design! If you're up for it, we'd love to learn more about fixed background behavior issues/gotchas you've experience on mobile to make sure it's something we cover moving forward. 🙇‍♀️

  • @mikepapahotel
    @mikepapahotel 4 года назад

    Hey Webflow - yet another awesome tutorial! I'm fairly new to Webflow and I'd love to examine how you did the 3 scrolling sections with their fixed BG images of the cushions from 2m:54s.
    Is that page available anywhere on webflow.io so that I could bring it in as a read-only to see how you did it? I've spent the last hour or so trying it for myself without success.
    Again - sincere thanks for all your brilliant tutorials - without doubt they're the best I've ever seen for teaching about/supporting any platform I've come across in the past 20 years!

    • @Webflow
      @Webflow  4 года назад +2

      Hi, Michael Hancock! We'll put something together and share it here ASAP (most likely Monday), as well as add that link to the lesson notes. Great idea!

    • @mikepapahotel
      @mikepapahotel 4 года назад

      @@Webflow Many thanks guys - I appreciate that! 😊👍🏻

    • @Webflow
      @Webflow  4 года назад +2

      Hi ​@@mikepapahotel! Thanks for reaching out regarding the fixed parallax scroll background layout. The project is now available to open or clone to interact with the layout. Link to project: webflow.com/website/Fixed-backgrounds-with-parallax-scrolling?s=background-fixed

    • @mikepapahotel
      @mikepapahotel 4 года назад +1

      @@Webflow OUTSTANDING!! Thank you again for your excellent support! 👌🏻

  • @dastinliedke9251
    @dastinliedke9251 2 года назад

    Love it!

  • @madkernell
    @madkernell 4 года назад +2

    Webflow university rocks.

  • @pieteb_nl
    @pieteb_nl 3 года назад

    Where is this "hero visual" and "hero content" coming from? Have no idea what element is selected here. Are it images?

    • @Webflow
      @Webflow  3 года назад

      The hero image is a background image. ruclips.net/video/GxhbxvUIUd4/видео.html

  • @ShxQDesigns786
    @ShxQDesigns786 4 года назад

    How did you make the navbar with the logo in the middle

    • @joshuadiniz684
      @joshuadiniz684 4 года назад

      You can set a max width on your navbar container!

  • @2020davidg
    @2020davidg 3 года назад

    Brilliant!

  • @oleww50
    @oleww50 4 года назад +2

    “Frying bacon” 😂😂

  • @njengathegeek
    @njengathegeek 2 года назад

    "your credit card number ending in 2636 is ours" spare my rib 😂😂😂

  • @ajaymishra-jg2qe
    @ajaymishra-jg2qe 2 года назад

    Please give me the name of tarcher
    I want to follow him personally
    Please please

  • @smartfort2741
    @smartfort2741 Год назад

    Жаль что нет такой функции в мобильной версии

  • @dmanprohere
    @dmanprohere 2 года назад

    There is parallax image?

    • @Webflow
      @Webflow  2 года назад

      This part of the video that speaks about a fixed background may be what you are looking for: ruclips.net/video/GxhbxvUIUd4/видео.html
      If this isn't it, here is another tutorial that might help:
      university.webflow.com/lesson/parallax-movement-on-scroll

  • @Ms.Robot.
    @Ms.Robot. 3 года назад

    Very nice. ❤️💋

  • @hsabes400
    @hsabes400 8 месяцев назад

    I would bet every dollar I've ever seen this guy is a huge fan of John Mulaney

  • @yvessigner5503
    @yvessigner5503 2 года назад

    There is no "parallax" chapter
    in the lesson.

  • @preetdhillon5861
    @preetdhillon5861 4 года назад

    i love you guys

  • @lobsterganggang
    @lobsterganggang Год назад

    3:25

  • @ovalayacademy364
    @ovalayacademy364 4 года назад

    WHY?!!!! WHY ARE YOU SO FUCKING AWESOME!!!!!!

  • @yvessigner
    @yvessigner 3 года назад

    This tutorial does't cover parallax background

  • @AmirXplorer
    @AmirXplorer 2 года назад

    😂😂😂 I forgot why I came here...

  • @maddypape
    @maddypape 3 года назад +1

    This is better than netflix binging for us UX designers