How Apple do scroll-based video scrubbing using CSS and Javascript

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

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

  • @bruhmoment3731
    @bruhmoment3731 4 месяца назад

    This channel is like a goldmine to me. I've seen so many cool web design effects on the internet. Have no idea how to implement them and I don't even know what to search to find tutorials about them. This channel is full of those cool effects I have been wanting to try.

    • @bruhmoment3731
      @bruhmoment3731 4 месяца назад

      and on top of that you're an excellent teacher

  • @codespice
    @codespice 3 месяца назад +6

    How to make the video smmoth like apple

  • @HuyenNguyen-bb3cg
    @HuyenNguyen-bb3cg 3 месяца назад

    Thank you so much! Simple but powerful JS and CSS techniques

  •  11 месяцев назад +1

    Your content is getting better and better. nice video man

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

      Glad you think so! We appreciate it!

  • @katiepring6774
    @katiepring6774 5 месяцев назад

    Great video!!! Thank you so much! I really appreciated how well you explained everything, especially the javascript! It works so well !!

  • @streamingvideo6654
    @streamingvideo6654 3 месяца назад

    This is awesome mate! Simple JS but works great. Thanks so much.

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

    YES! This is what we've all been waiting for.

    • @SuperHi
      @SuperHi  11 месяцев назад +1

      You ask and you shall receive!!!!

    • @televisie456
      @televisie456 11 месяцев назад +1

      @@SuperHi would love to see a preloader, so all these content heavy tutorials would load smoothly.

  • @安田胡桃
    @安田胡桃 Месяц назад

    Thank you so much!!! This help a lot

  •  Месяц назад

    Nice video, however it does not look good on mobile viewport

  • @plastic_hand
    @plastic_hand 11 месяцев назад +1

    thank you so very much. that helped a lot. But how do i get the scroll video smoother? It is like jumping through the frames

    • @SuperHi
      @SuperHi  11 месяцев назад +4

      Hey! A few quick ways to do it would be to increase the length of the video and/or shorten the scrollable distance so that there's more dense frames per area. Another option would be to 'tween' the video's currentTime, where you'd have an animate loop that is moving towards the aim point in the video by 1/60th of a frame each time - I did try this in an initial test and while it works well going forwards, it's a bit choppy when going backwards as videos don't really like to 'play' backwards!

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

    So cool! thanks mate

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

      No problem! Glad you liked it!

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

    you do amazing job!

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

      Thank you so much!

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

    good job! thank you!

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

      Our pleasure! Thanks Ivan!

  • @voxtelnismo
    @voxtelnismo 9 месяцев назад

    Amazing. And now the magic is gone. 😂

  • @mustafa.wael-dev
    @mustafa.wael-dev 11 месяцев назад +1

    I think apple use image sequences instead of video

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

      Yes, you're right, they do both options in different areas of the site, video seems to be their most common one based on our research, and it's probably due to video being smaller in total file size than the same amount of frames in an image sequence.

  • @sa8452
    @sa8452 4 месяца назад

    Wait, why’re the views on this so low?