触れるミュージックビデオ!? インライン動画再生のはなし - KAYAC engineers' blogHTMLファイ部ののびーです。12月ぶりです。 さて今回は、以前にとあるアイドルさんのWebサイトを制作した際に使った、 インライン動画再生 という技術について、その仕組みや使い所を解説していこうと思います。 今回のために作ったデモサイトがこちらになります。ぜひこちらのページもスマホで開きつつ、記事をご覧ください。 https://fnobi.github.io/plays-inline-demo/demo/ インライン動画再生とは 動画を再生するWebサイトを作ったことがある方ならわかると思いますが、これまでiOS Safariでは、動画を再生する際は必ず全画面再生になってしまう、という制約がありました。 この制約により、たとえば動画をサイトの背景に使ったり、動画と連動する演出を出したりといった表現が、iOSのシェア率を考えると断念せざる終えない…という状況が続いていました。 ところが、
