I had fun making it and now I'm sharing it for anyone who might be interested in learning how it works or for anyone who wants to slap it into their own profile for the nostalgia.
<marquee class="tv" behavior="alternate" direction="down">
<marquee behavior="alternate" direction="right">
<div class="dvd"></div>
</marquee>
</marquee>
<style>
.tv {
border: 1px solid #fafafa;
background-color: #000;
margin: 5px 0;
height: 339px;
}
.dvd {
width: 40px;
height: 18px;
background-repeat: no-repeat;
background-position: center;
background-size: contain;
background-image: url("data:image/svg+xml;base64,PHN2ZyBmaWxsPSIjZmFmYWZhIiB2aWV3Qm94PSIwIDAgMjAwIDkwIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjxwYXRoIGQ9Ik0xMTMuOSAxNS41ODdzLTEzLjc0MyAxNi45MzgtMTMuMDQgMTguMDE4Yy45NzUtMS4wOC00LjkzNC0xOC4yMDMtNC45MzQtMTguMjAzcy0xLjIzMy0zLjYtNS4xMDItMTUuNDAxSDE3LjE4bC0yLjU2IDExLjA3OGgyMy44NzhjMTIuNDE1IDAgMTkuOTk1IDUuMTM3IDE3Ljg3OCAxNC4yMzgtMi4yODcgOS45MS0xMy4xMjMgMTQuMTQxLTI0LjY2NSAxNC4xNDFoLTQuMzE2bDUuNTUyLTI0LjIzMUgxMy42NTJMNS40NiA1MC42MjhoMjcuMzk4YzIwLjYxMiAwIDQwLjE2Ni0xMS4wNzcgNDMuNjkyLTI1LjMxMi42MTctMi42MTYuNTMtOS4xOTQtMS4wNTQtMTMuMDY1IDAtLjA5My0uMDkxLS4yNzEtLjE3OC0uNTM3LS4wODctLjA5NC0uMTc4LS43MjMuMTc4LS44MTUuMTcyLS4wOTIuNTI1LjI3MS41MjUuMzU4IDAgMCAuMTc5LjQ1Ny4zNTEuODE0bDE3LjQ0IDUwLjM2MiA0NC40MDQtNTEuMjY0IDE4Ljc2MS0uMDkyaDQuNTc5YzEyLjQyNCAwIDIwLjA5IDUuMTM3IDE3Ljk2OSAxNC4yMzgtMi4yOSA5LjkxLTEzLjIwNSAxNC4xNC0yNC43NSAxNC4xNGgtNC40MDVsNS42MzUtMjQuMjNoLTE5LjI4N2wtOC4xOTggMzUuNDAyaDI3LjM5OGMyMC42MTEgMCA0MC4zNDMtMTEuMDc3IDQzLjYwNC0yNS4zMTIgMy4zNDctMTQuMjM4LTExLjEwMS0yNS4zMTctMzEuODktMjUuMzE3aC00MC44N0MxMTUuOTI4IDEzLjA1OCAxMTMuOSAxNS41ODUgMTEzLjkgMTUuNTg1ek05NC40MjkgNjIuNjE0QzQyLjI4NiA2Mi42MTQuMDA1IDY4Ljc0LjAwNSA3Ni4zMWMwIDcuNTY1IDQyLjI4MSAxMy42OTEgOTQuNDI0IDEzLjY5MSA1Mi4yMzkgMCA5NC41MjQtNi4xMjYgOTQuNTI0LTEzLjY5MS4wMDEtNy41Ny00Mi4yODQtMTMuNjk2LTk0LjUyNC0xMy42OTZ6bS0zLjM0NiAxOC41NjFjLTExLjk4IDAtMjEuNTgtMi4wNzQtMjEuNTgtNC42czkuNTk5LTQuNTk0IDIxLjU4LTQuNTk0YzExLjg4OCAwIDIxLjQ5OCAyLjA2OCAyMS40OTggNC41OTUgMCAyLjUyNS05LjYxIDQuNTk5LTIxLjQ5OCA0LjU5OXoiLz48L3N2Zz4=")
}
</style>
Comments
Displaying 1 of 1 comments ( View all | Add Comment )
Time Life Magazines
The other day I was watching the Hulu screensaver, which is just a bouncer like this, but it made me so angry. It's actually just a video loop. There's a section where they ever so slightly curve it's path to perfectly line up with where the loop begins. What's even more criminal is that their logo never hits the corner of the screen. What heathens!
Report Comment
That is so evil! Seriously super villain tier shit
by Usual Egg; ; Report