Divtober Day 27: Film

This content originally appeared on DEV Community and was authored by Alvaro Montoro

Day of the word is "film", so here is a clapperboard (a.k.a. slate) needed in every film set to help with the audio/video synchronization. It animates a little on hover.

It uses perspective to simulate the 3D, but there's more to it: as the clapperboard is drawn with a single HTML tag we don't have enough elements to go "full 3D." The solution was using shadows and stacking them in a way that provides a fake sense of perspective (on top of the CSS perspective.)

This content originally appeared on DEV Community and was authored by Alvaro Montoro

Print Share Comment Cite Upload Translate Updates

APA

Alvaro Montoro | Sciencx (2021-10-27T04:24:56+00:00) Divtober Day 27: Film. Retrieved from https://www.scien.cx/2021/10/27/divtober-day-27-film/

MLA

" » Divtober Day 27: Film." Alvaro Montoro | Sciencx - Wednesday October 27, 2021, https://www.scien.cx/2021/10/27/divtober-day-27-film/

HARVARD

Alvaro Montoro | Sciencx Wednesday October 27, 2021 » Divtober Day 27: Film., viewed ,<https://www.scien.cx/2021/10/27/divtober-day-27-film/>

VANCOUVER

Alvaro Montoro | Sciencx - » Divtober Day 27: Film. [Internet]. [Accessed ]. Available from: https://www.scien.cx/2021/10/27/divtober-day-27-film/

CHICAGO

" » Divtober Day 27: Film." Alvaro Montoro | Sciencx - Accessed . https://www.scien.cx/2021/10/27/divtober-day-27-film/

IEEE

" » Divtober Day 27: Film." Alvaro Montoro | Sciencx [Online]. Available: https://www.scien.cx/2021/10/27/divtober-day-27-film/. [Accessed: ]

rf:citation

» Divtober Day 27: Film | Alvaro Montoro | Sciencx | https://www.scien.cx/2021/10/27/divtober-day-27-film/ |

Please log in to upload a file.

There are no updates yet.
Click the Upload button above to add an update.

You must be logged in to translate posts. Please log in or register.