on scroll div animation code example
Example 1: animation on scroll css
svg {
position: fixed;
animation: rotate 1s linear infinite;
animation-delay: calc(var(--scroll) * -1s);
}
Example 2: scrolling animation css
.inline-photo {
border: 1em solid #fff;
border-bottom: 4em solid #fff;
border-radius: .25em;
box-shadow: 1em 1em 2em .25em rgba(0,0,0,.2);
margin: 2em auto;
opacity: 0;
transform: translateY(4em) rotateZ(-5deg);
transition: transform 4s .25s cubic-bezier(0,1,.3,1),
opacity .3s .25s ease-out;
max-width: 600px;
width: 90%;
will-change: transform, opacity;
}