Transition To Video |
Transition To Video |
sonic4 |
Feb 28 2017, 11:45 AM
Post
#1
|
Group: Members Posts: 7 Joined: 6-February 17 Member No.: 26,296 |
So you know how in older video games where, if you wait on a title screen long enough, you get a demo? I want to do that in CSS, however, i don't know how. Here's my @keyframes rule
@keyframes switch { from {background-image: url(images/titlescreen.gif)} to {background-image: url(videos/commercial.mp4)} } Here's what I put in my body CSS (same sheet): background-image: url(images/titlescreen.gif); background-repeat: no-repeat; background-size: cover; animation-name: switch; animation-duration: 10s; IF this is impossible, then let me know. |
Christian J |
Feb 28 2017, 05:32 PM
Post
#2
|
. Group: WDG Moderators Posts: 9,661 Joined: 10-August 06 Member No.: 7 |
So you know how in older video games where, if you wait on a title screen long enough, you get a demo? I want to do that in CSS, however, i don't know how. AFAIK you can't use videos in CSS backgrounds, but an animated GIF image might work, or you could create the whole "video" with complex animations (as opposed to using an MP4 file or similar multimedia formats). Or you could use javascript to display an autoplaying HTML5 VIDEO element with an MP4 file. |
sonic4 |
Mar 1 2017, 12:03 PM
Post
#3
|
Group: Members Posts: 7 Joined: 6-February 17 Member No.: 26,296 |
Thank you.
|
Lo-Fi Version | Time is now: 27th April 2024 - 11:45 AM |