You can showcase websites, web apps, and blog posts by adding a simple scroll animation to the default posts-01 component. In this guide, I'll show you how to do it.

Here is how it is implemented on unicornplatform.com

Step 1/4

Copy this code:

<style>
.posts-01__text{display: none;}
.posts-01__img{height:auto;
transition: 2s cubic-bezier(0.67, 0.17, 0, 0.94) transform}
img.posts-01__img:hover{
    transform: translateY(-213px);
}
 </style>

Step 2/4

Insert a posts-01 component into your page.

Step 3/4

Now you should insert a Custom HTML component next to the posts-01 component.

Step 4/4

Put the code you've copied before into the Custom HTML component.



And that's it!

Lifehack

If you use Google Chrome, you can make a full-size screenshot of any web page in just a few clicks.

Right-click on an empty area of the page you want to take a screenshot of, and choose Inspect.



And in the upper right corner, click on the three dots and select the option Capture full size screenshot.



Done! After a few seconds, the screenshot will appear in your downloads.

Updated on: 09/03/2022