https://tympanus.net/Development/SmoothScrollingImageEffects/index.html

Smooth Scrolling Image Effects

Picking up on our last tutorial on how to add smooth scrolling plus image animations to a page, we’d like to explore some more ideas for animations. We’ve made a small set of effects that show how you can apply some interesting transforms to elements like images and text while scrolling the page smoothly. Inspirations for some … Read more

https://css-tricks.com/animating-with-clip-path/

Animating with Clip-Path

clip-path is one of those CSS properties we generally know is there but might not reach for often for whatever reason. It’s a little intimidating in the sense that it feels like math class because it requires working with geometric shapes, each with different values that draw certain shapes in certain ways. We’re going to dive … Read more

https://github.com/lydiahallie/javascript-questions

List of (Advanced) JavaScript Questions

I post daily multiple choice JavaScript questions on my Instagram, which I’ll also post here! From basic to advanced: test how well you know JavaScript, refresh your knowledge a bit, or prepare for your coding interview!   The answers are in the collapsed sections below the questions, simply click on them to expand it. Good luck

https://css-tricks.com/everything-you-need-to-know-about-date-in-javascript/

Everything You Need to Know About Date in JavaScript

Date is weird in JavaScript. It gets on our nerves so much that we reach for libraries (like Date-fns and Moment) the moment (ha!) we need to work with date and time. But we don’t always need to use libraries. Date can actually be quite simple if you know what to watch out for. In this article, I’ll … Read more

https://scotch.io/tutorials/implementing-a-scroll-based-animation-with-javascript

Implementing a Scroll Based Animation with JavaScript

There is a kind of animations that has not stopped increasing its presence in the most modern and original websites: the animations based on the scroll event of Javascript. This trend literally exploded when the parallax effects appeared, and since then its use has become more frequent. Table of Contents HTML Structure Applying CSS styles Implementing Animations … Read more

https://tornis.robbowen.digital/

JavaScript library that watches the state of your browser’s viewport

Introducing Tornis. Taking its name from the forest watchtowers of Latvia, Tornis is a minimal JavaScript library that watches the state of your browser’s viewport, allowing you to respond whenever something changes. Think of Tornis as a store for your viewport. Tornis tracks state for: Mouse position 642, 434 Mouse cursor velocity 4, -10 Viewport size 1536, 686 Scroll … Read more

https://tympanus.net/Development/AnimatedImageColumns/

Animated Image Column

Today we’d like to share a little layout with you. The idea is based on the current trend of a grid layout where the columns are animated. You can see this kind of animation in Aristide Benoist’s amazing design for Everest or Hrvoje Grubisic’s GETZ — Photography Portfolio Website concept. In our demo, we animate a decorative image grid … Read more