Good day to all. I started to update my knowledge in css here, and suddenly a thought came (maybe I saw it somewhere) how to track, for example, on a landing page that a person is looking through just some part of the page. What I mean: The person went to the site, looked, read, then went scrolling down, and when he reached a certain block, the animation of the animation written in sss begins. Those. If we consider Landing, then it consists, suppose, of 4 blocks, and on each block, when viewed by the user, animation begins, for example, the appearance of text from bottom to top using keyframes and animation.

  • What is the question then? - user208916
  • @Khipster, how to track, for example, on a landing page, that a person is looking at exactly some part of the page. - Grundy
  • one
    In general, the problem is not solved, since it is impossible to determine what exactly a person is looking at . Quite a situation - the user scrolled the site, and then just walked away from the computer / phone, etc. From the point of view of a person, he does not look through this piece of code, but the script can not track it in any way . If, of course, you do not have access to the webcam, by which you can get a picture of the user and determine which part of the screen he is watching - Grundy
  • @Grundy You do not take into account the possibility of a cat-type object appearing in the webcam's sight. So the webcam is not a panacea. - user208916 5:59 pm
  • @Khipster, of course I take into account - Grundy

2 answers 2

You can use wow.js in conjunction with animation.css, there you can do it all. https://www.youtube.com/watch?v=7gMYtFGjg3s

    Use the scroll JavaScript event.

    • And as for the scroll, in your opinion, track on which part the person is located, given that adaptive layout is used and the screen size will change. - Kamil NHOT
    • @KamilNHOT, the current offset is available inside the handler - this is quite suitable for some piece . - Grundy