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

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

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

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

    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 6 месяцев назад

      and on top of that you're an excellent teacher

  •  Год назад +1

    Your content is getting better and better. nice video man

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

      Glad you think so! We appreciate it!

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

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

    • @SuperHi
      @SuperHi  Год назад +1

      You ask and you shall receive!!!!

    • @televisie456
      @televisie456 Год назад +1

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

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

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

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

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

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

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

  • @CoderDalower
    @CoderDalower 2 месяца назад

    Very helpful video. Thanks a lot

  • @plastic_hand
    @plastic_hand Год назад +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  Год назад +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!

  • @byteaddis-t9r
    @byteaddis-t9r 6 месяцев назад +7

    How to make the video smmoth like apple

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

    Thank you so much!!! This help a lot

  • @ShrutikaSh
    @ShrutikaSh 2 месяца назад

    i tried, this i works, love it, but how to make it smoot, the video playing is kind of choppy :(

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

    So cool! thanks mate

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

      No problem! Glad you liked it!

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

    you do amazing job!

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

      Thank you so much!

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

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

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

    good job! thank you!

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

      Our pleasure! Thanks Ivan!

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

    Amazing. And now the magic is gone. 😂

  • @mustafa.wael-dev
    @mustafa.wael-dev Год назад +1

    I think apple use image sequences instead of video

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

      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 6 месяцев назад

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