YouTubeはどのようにこのアニメーションを制作していますか？

-1

これを説明するGIFはhttp://imgur.com/gallery/ODKNSです。これがJavascriptアニメーションの場合、これを可能にするために私が従うことができるJavascriptの幅広いヒントはありますか？YouTubeはどのようにこのアニメーションを制作していますか？

出典

2017-02-16 laxerrrr

はい、それはGIF可能性があり、それはJavascriptをすることができ、それもそれは簡単なCSS遷移することができCSS – maksymiuk

である可能性があります。 – dfsq

そのことについて考えていなかった – laxerrrr

シンプルなCSSトランジションとjQueryでこれを行うCodePenを作成しました（ここでいくつかのコードを追加すると、SOが私にcodepenへのリンクを投稿できるようになります...）

<div class="container"> 
    <input type="text" id="input" placeholder="click me"/> 
    <div class="underline"> 
     <div id="highlight"/> 
    </div> 
</div>

http://codepen.io/anon/pen/JEVeqW

出典

2017-02-17 00:09:14 Juuso

ありがとう！まさに私が探していたもの。私はちょうどジャバスクリプトを得ることができなかった！ – laxerrrr

ここにはJavaScriptが一切不要です。 – dfsq

純粋なCSSでこれをどうやって行いますか？私が考えることができる唯一のことは、input要素の中にアニメーションを入れ子にして、cssを使うことです - それは可能ですか？ – Juuso

YouTubeはどのようにこのアニメーションを制作していますか？

答えて

関連する問題