top | item 5494480

(no title)

jechen | 13 years ago

The source reveals that the video mast is actually an animated gif (or cinemagraph, as these tasteful creations are also known as). The stutter in the beginning kind of gives it away, but still quite impressive they included such a long edit and got it to load relatively fast (coming from reddit where uncompressed gifs run amok).

discuss

cocoflunchy|13 years ago

For me it's a <video> element, which kind of makes more sense.

    <video style="display: block;" class="_534g" id="fbhome-cinemagraph" autoplay="1" loop="1">
        <source src="https://fbcdn-dragon-a.akamaihd.net/cfs-ak-ash3/676434/970/135351913305575_544816858.mp4">
        <source src="https://fbcdn-dragon-a.akamaihd.net/cfs-ak-prn1/676663/942/135351913305575_1958437471.ogv">
        <img class="_53ol _53ol img" src="https://fbcdn-dragon-a.akamaihd.net/cfs-ak-ash3/676513/617/135351913305575_1421925707.jpg" alt="">
    </video>

sdqali|13 years ago

I got a <video> tag as well. Firefox on Mac OS X.

unknown|13 years ago

[deleted]

brycedriesenga|13 years ago

Could you perhaps screenshot what you're seeing or paste a code sample? I'm seeing the same thing as cocoflunchy, just a <video> element, no gif.

jechen|13 years ago

Well, on second look it seems like the mast is using <video> for me as well- I originally looked too far and thought the id "fbhome-cinemagraph-canary" led to an animated gif. Apologies on making the wrong call!

Also, as a previous reply pointed out, what they're doing really doesn't count as a cinemagraph- FB needs to stop butchering words.

chimeracoder|13 years ago

> or cinemagraph, as these tasteful creations are also known as

Just so you know, this is not a cinemagraph. A cinemagraph is not just a synonym for "high-quality animated gif". A cinemagraph isolates one moving part from an otherwise static picture (and the assumption is that at least some motion is frozen - ie, not everything that could be moving is moving).

It's kind of like spot-color[0], but for motion.

Lots of good examples: http://iwdrm.tumblr.com/

[0] http://en.wikipedia.org/wiki/Spot_color

trhtrsh|13 years ago

Facebook is calling it a cinemegraph (see the HTML snippet in sibling commment) as part of their comprehensive war to redefine every word in the English language to be something of theirs.