[css-content]: video

Previous Topic Next Topic
 
classic Classic list List threaded Threaded
8 messages Options
Reply | Threaded
Open this post in threaded view
|

[css-content]: video

Brian Kardell
Ana Tudor tweeted today [1]

"""
CSS wish: to be able to do this:

div:before {
  content: url(video.mp4);
}

It works for images, so why not for video too?
"""

My initial thought was that such a video would be inaccessible and probably a lot worse than an image because videos have to be interactive.  However,  the third example in the intro of CSS Generated Content Module Level 3[2] seems to imply that content can be a .mov which is a video format and some folks on twitter showed me things like 'using a video as a background' (but that seems like a different case than content to me and a whole other ball of wax).  

So, I guess... It does seem plausible that somehow 'decorative' video which was not interactive at all would show there and I think that is what the example is showing...  I suppose what I am wondering at this point:  Am I reading the example correctly and are we expecting that might work - and be inherently non-interactive/inert as it is decorative?
Reply | Threaded
Open this post in threaded view
|

Re: [css-content]: video

Henrik Andersson
If you can do an animated gif, then you should be able to use a proper
video codec.

Reply | Threaded
Open this post in threaded view
|

Re: [css-content]: video

Tab Atkins Jr.
On Mon, Jun 13, 2016 at 1:31 AM, Henrik Andersson <[hidden email]> wrote:
> If you can do an animated gif, then you should be able to use a proper
> video codec.

That is, unfortunately, not necessarily true today.  At least in
Chrome, playing video claims some limited video-related system
resources. The result is much more efficient than playing a gif, but
you can't put too many on the page at once (gifs, on the other hand,
scale basically indefinitely, but waste way more resources overall).
That's part of why we haven't (yet) tried to support <img
src=video.mp4> and display it Vine-like.  We're working on this, tho!
I don't know what the situation is in other browsers.

~TJ

Reply | Threaded
Open this post in threaded view
|

Re: [css-content]: video

Dean Jackson-7
In reply to this post by Brian Kardell
I think both <img src="cutekittens.mp4"> and url(cutekittens-v-bulldozer.mp4) should be supported. We've done some internal prototypes and it's very nice.

I'm not sure about media controls on the <img> case. I think we should start with something that is the same behaviour as a GIF is today.

Dean


On Jun 12, 2016, at 4:57 PM, Brian Kardell <[hidden email]> wrote:

Ana Tudor tweeted today [1]

"""
CSS wish: to be able to do this:

div:before {
  content: url(video.mp4);
}

It works for images, so why not for video too?
"""

My initial thought was that such a video would be inaccessible and probably a lot worse than an image because videos have to be interactive.  However,  the third example in the intro of CSS Generated Content Module Level 3[2] seems to imply that content can be a .mov which is a video format and some folks on twitter showed me things like 'using a video as a background' (but that seems like a different case than content to me and a whole other ball of wax).  

So, I guess... It does seem plausible that somehow 'decorative' video which was not interactive at all would show there and I think that is what the example is showing...  I suppose what I am wondering at this point:  Am I reading the example correctly and are we expecting that might work - and be inherently non-interactive/inert as it is decorative?

Reply | Threaded
Open this post in threaded view
|

Re: [css-content]: video

Garrett Smith


On Mon, Jun 13, 2016 at 3:58 PM, Dean Jackson <[hidden email]> wrote:
I think both <img src="cutekittens.mp4"> and url(cutekittens-v-bulldozer.mp4) should be supported. We've done some internal prototypes and it's very nice.

I'm not sure about media controls on the <img> case. I think we should start with something that is the same behaviour as a GIF is today.


If it's possible to harness such powerful control over the browser, people will do it in the worst way possible. They might even use JS libraries and then call it a best practice for ads, etc that the user can't see and cannot stop.

The `content` property doesn't seem like a good place to declare media for CSS. Thinking if you want :active to trigger audio, etc and have that be presentation-only.
--
Reply | Threaded
Open this post in threaded view
|

Re: [css-content]: video

Dean Jackson-7

On Jun 13, 2016, at 5:26 PM, Garrett Smith <[hidden email]> wrote:



On Mon, Jun 13, 2016 at 3:58 PM, Dean Jackson <[hidden email]> wrote:
I think both <img src="cutekittens.mp4"> and url(cutekittens-v-bulldozer.mp4) should be supported. We've done some internal prototypes and it's very nice.

I'm not sure about media controls on the <img> case. I think we should start with something that is the same behaviour as a GIF is today.


If it's possible to harness such powerful control over the browser, people will do it in the worst way possible. They might even use JS libraries and then call it a best practice for ads, etc that the user can't see and cannot stop.

The `content` property doesn't seem like a good place to declare media for CSS. Thinking if you want :active to trigger audio, etc and have that be presentation-only.

I suggest it that it should be equivalent to GIF. No audio. No interaction. No worse, but an improvement in quality, asset download size and system resources (if implemented correctly).

Dean

Reply | Threaded
Open this post in threaded view
|

Re: [css-content]: video

Brad Kemper

On Jun 13, 2016, at 5:34 PM, Dean Jackson <[hidden email]> wrote:


On Jun 13, 2016, at 5:26 PM, Garrett Smith <[hidden email]> wrote:



On Mon, Jun 13, 2016 at 3:58 PM, Dean Jackson <[hidden email]> wrote:
I think both <img src="cutekittens.mp4"> and url(cutekittens-v-bulldozer.mp4) should be supported. We've done some internal prototypes and it's very nice.

I'm not sure about media controls on the <img> case. I think we should start with something that is the same behaviour as a GIF is today.


If it's possible to harness such powerful control over the browser, people will do it in the worst way possible. They might even use JS libraries and then call it a best practice for ads, etc that the user can't see and cannot stop.

The `content` property doesn't seem like a good place to declare media for CSS. Thinking if you want :active to trigger audio, etc and have that be presentation-only.

I suggest it that it should be equivalent to GIF. No audio. No interaction. No worse, but an improvement in quality, asset download size and system resources (if implemented correctly).

hat sounds reasonable to me.

Reply | Threaded
Open this post in threaded view
|

Re: [css-content]: video

Dean Jackson-7

On 3 Jul 2016, at 1:55 AM, Brad Kemper <[hidden email]> wrote:


On Jun 13, 2016, at 5:34 PM, Dean Jackson <[hidden email]> wrote:


On Jun 13, 2016, at 5:26 PM, Garrett Smith <[hidden email]> wrote:



On Mon, Jun 13, 2016 at 3:58 PM, Dean Jackson <[hidden email]> wrote:
I think both <img src="cutekittens.mp4"> and url(cutekittens-v-bulldozer.mp4) should be supported. We've done some internal prototypes and it's very nice.

I'm not sure about media controls on the <img> case. I think we should start with something that is the same behaviour as a GIF is today.


If it's possible to harness such powerful control over the browser, people will do it in the worst way possible. They might even use JS libraries and then call it a best practice for ads, etc that the user can't see and cannot stop. 

The `content` property doesn't seem like a good place to declare media for CSS. Thinking if you want :active to trigger audio, etc and have that be presentation-only. 

I suggest it that it should be equivalent to GIF. No audio. No interaction. No worse, but an improvement in quality, asset download size and system resources (if implemented correctly).

hat sounds reasonable to me.

Hats are very reasonable, especially in summer.

WebKit might implement this soon.

Dean