Watch fall baseball starting 10/25 on FOX. Enjoy $49.99/mo for your first 2 months. New users only. Terms apply. Then $72.99/mo.
動画をページいっぱいの背景として使用するのは、ここ数年人気の高いテクニック。 その方法はいくつかありますが、今回はレスポンシブ対応、動画の上にコンテンツを配置しスクロールでカーテンのように引き上げるページを実装するチュートリアルを紹介します。 HTML5のvideo要素で自サーバーの動画を配置するのではなく、YouTubeの動画を使うので、サーバーのレスポンスを気にする必要もありません。 デモページ:下までスクロール 実装 使用するリソース チュートリアルにあたり、下記のリソースを使用しています。 jQuery jquery.mb.YTPlayer YouTubeの動画を背景として表示するjQueryのプラグイン フォント:Google Fonts (Raleway, Lato) アイコン:Font Awesome 背景に使う動画の注意点 背景に使う動画は、下記の点に注意してください。 動
PrettyEmbed.js Demo - CodePen Youtube動画はカッコよく埋め込もう「PrettyEmbed.js」。 通常埋め込むと動画コントローラーやラベルが表示されて便利なんですが、どうしてもYoutube埋め込んだ感が凄くなりますね。 そこで、PrettyEmbedを使えば次のように。せっかくデザインしたサイトもYoutube埋め込みでかっこわるくならないようにできますね 関連エントリ Youtube,Vimeo,Dailymotion等の動画APIを共通化できる「jquery-video」 流行りのYoutube風ローディングバー実装jQueryプラグイン YoutubeのChannel・Playlistの動画リストを表示できるjQueryプラグイン「PlumTube」
8月24 RubyプログラムからYouTube Data APIを使って動画検索 カテゴリ:ruby RubyプログラムからYouTube Data APIを使って動画検索を行ってみました。 前回のプログラム同様に、YouTube Data APIが返すXMLを解析するために、Nokogiriというパッケージを使っています。このパッケージをインストールしていない場合は、RubyGemsを使ってインストールします(Windowsの場合は、sudoは不要)。 $ sudo gem install nokogiri プログラムは、以下の通りです。 require 'rubygems' require 'nokogiri' require 'open-uri' URL = 'http://gdata.youtube.com/feeds/api/videos?vq=' keywords = URI.
はじめに Youtubeの提供するData APIを使用して、動画を検索するサンプルアプリケーションをRuby on Railsで作ってみた。前回のエントリRuby on RailsでYoutubeから動画を検索するサンプルアプリケーション - 大人になったら肺呼吸では、Data APIが返すXMLを解析する際に、REXMLという標準のXMLライブラリを使用したが、今回はLibxml-Rubyという別のXMLライブラリを使用した。 ※以下の手順は、さくらインターネットのレンタルサーバ上にアプリケーションを作成していくことを前提としている。 事前準備 Libxml-Rubyのインストール 以下のコマンドを実行し、Libxml-Rubyをインストールする。 %setenv RB_USER_INSTALL true %gem18 install libxml-ruby プロジェクトの作成 You
たとえば、検索結果を表示する簡単なアプリケーションのために、整形されたHTMLを含むデータを取得するには次のように指定します。 http://gdata.youtube.com/feeds/base/videos フィードの種類 データを取得するフィードは数種類あります。 通常はVideoフィードを使えば十分ですが、投稿者の情報やコメントの情報等を取得するフィードもありますので、必要に応じて使い分けてください。 全てのフィードは読み取り専用であり、認証無しでリクエストすることができます。 また、新しく投稿されたビデオがフィードで取得できるようになるには、インデックス化のため数時間かかります。 Videoフィード Videoフィードには、ビデオ、関連動画、standard、お気に入り、再生リスト、コメントのフィードがあります。 ビデオフィード ビデオを検索するには、ビデオフィードを使います。
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く