4/3/2023 0 Comments Things for mac videos![]() ![]() So why isn’t this simple? Long legal story short: There are two significant browsers from two big companies. We’ve had transparent video formats for years. The big question is now: What if the background is not abstract? What if you want to play your video on top of rendered HTML, like in the first example? For that, we need a bigger knife. It works because the background is abstract and nicely blends with the site’s background. So that’s one workaround - smoke and mirrors. Then, they matched the background color with the color under the text and used the new, combined video as the background element. The Typeform designers combined the UI video on top of the background video into one video. And to top it off, they even have a video running below the video. The elements shrink and grow like it’s no big deal. See how they have two videos going on here? On the top layer, there’s a video showing their product. Your answer decides if we can go the easy way or the slightly more brutal way. Under your video, the big question that will determine our path as we advance is: what do you want to use as a background? So, the blue box is your website, the red box is your transparent video, and the green box is your optional foreground, which might be a video. In this post, I’ll show you how to do this and how to cheat and make a shortcut using smoke and mirrors. Maybe because it’s just not supported - in an obvious way. Here’s a more straightforward example ( demo page) ( codePen) Why isn’t transparency used more? See the live site here and the Webflow project here. What’s an example of alpha transparency on the web? What’s an example of alpha transparency on the web?.On top of that, the results look great and will set your project apart from those flat, boxy videos everyone else has. It’s as if someone decided a long ago that we won’t need this. And how do you even make a transparent video - a video with an alpha channel - in the first place? And if you do find out, how do you double-check that it is, in fact, transparent? It’s not a friendly environment. You may have even tried a Youtube embed or a Video tag and found that, nope, that didn’t work either. This post is a part of our series called The Big Guide to Transparent Backgrounds in videos and images ![]()
0 Comments
Leave a Reply. |
AuthorWrite something about yourself. No need to be fancy, just an overview. ArchivesCategories |