Forums

The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums Other How can I make something like this?

  • This topic is empty.
Viewing 3 posts - 1 through 3 (of 3 total)
  • Author
    Posts
  • #190502
    spinvogel
    Participant

    I saw this image on this website which is sort of a movie. When you hoover over it with your mouse a sequence of images appear.

    http://www.kapitaalutrecht.nl/winkel/

    Is there a tutorial out there that can help me to create something similar?

    #190504
    Paulie_D
    Member

    Looks like it was done with a <canvas> and a lot of images that are swapped in and out by Javascript.

    So search for “HTML canvas tutorial” on Google

    #190520
    Senff
    Participant

    There are a lot of separate images — each “frame” is one image — but they’re all hidden, except one of them. Which one is visible, just depends on the position of the mouse.

    The canvas is (probably) only used to detect the position of the mouse.

    Canvas detects mouse coordinate, passes it on to some JavaScript, that then makes one of the images visible.

    If the left coordinate of the mouse position is 0, then the first image is visible. If the left coordinate is between 20 and 30 (or so), the second image is visible. If it’s between 30 and 35, the third image is visible. And so on, and so on.

Viewing 3 posts - 1 through 3 (of 3 total)
  • The forum ‘Other’ is closed to new topics and replies.