ドットインストール代表のライフハックブログ
2014年5月8日2018年3月1日WEB制作, wordpress wordpressでブログを書いている時に、youtubeの動画をブログに埋め込んで紹介する事がありますよね。 埋め込み動画が一つだけならまだページ表示速度にさほど影響はないけど、複数の動画を埋め込んでいると大分表示速度が遅くなる。 面白い動画や話題等は人に紹介したくなるもの、それが多ければ多いほどページ表示速度が遅くなってしまう>< なので少しでも表示速度が解消されるように頑張ってコードを書いてみた。 ページ読み込みを軽くする方法 ページ表示速度を上げるために考えたのが、youtubeの動画を読み込む前に画像表示にして、画像をクリックしてから動画を読み込みにいく方法。 何回かテストして体感的に早くなりました。 サンプルコード functions.phpに以下を追加する これで記事ページ内の埋め込み動画は画像に置き換わり
Great news! The embed codes offered by these services are already responsive: Scribd (select 'Autosize') SoundCloud Storify Twitter Know of more? New embed type giving you problems? Please report any issues on GitHub. embedresponsively.com helps build responsive embed codes for embedding rich third-party media into responsive web pages. The code here is based on research and work by Theirry Koblen
Google , Webツール , YouTube , ソフトウェア , 動画コンテンツ , 趣味 , 音声 YouTube動画の音声をMP3に変換できるサービス「YouTubeMP3.tv」 2012.05.17 23:00 コメント数:[ 0 ] Tweet 「YouTubeMP3.tv」はYouTube動画の音声をMP3に変換できるサービスです。YouTube動画のURLを指定するだけでMP3に変換してくれます。 以下に使ってみた様子を載せておきます。 ライフハッカー[日本版]Amazon売上TOP5 1.SWISS+TECH スイス・テック Utili-Keyナイフ 2.SWISS+TECH ユーティリキー 24320 3.ノート型ホワイトボード NUboard (A4変型) 4.SWISS TECH スイステック ユティリティーキー6in1 キー型ツール ギフト缶入 5.
あまり見かけないタイプのライブラリだった のでメモ。Youtubeの動画を透過させる事 が出来るjQueryプラグインです。インター フェースもクールにされて全画面に配置した りオート再生させたりも可能でIE6や7でも 一応は動作してくれます。 僕はちょっと知らないんですけど、Youtubeって普通は透過出来ない、で合ってますよね?普通に出来るならちょっと恥ずかしい記事ですけどw 透過だけでなく、オート&リピート再生、ミュート設定も出来て、見た目もスッキリさせてくれています。以前はYoutube動画を背景にするjQueryプラグインをご紹介しましたが、今回は透過が出来るプラグイン。いろいろ出来るんですね・・ CPUの問題は否めないとして、これはちょっと素敵なので覚えておきたいです。透過のみに関してはIE6や7にも対応していますが、Operaは透過出来ませんでした。バージョンにもよるんですか
CSS: Elastic Videos これは必見かもなYoutube等の埋め込み動画を動的にリサイズするCSS例。 ブロックのサイズが変更された際において動画を固定サイズにしてしまうとレイアウトが崩れてしまいますが、公開されているサンプルを使うと、HTML5動画、embed/iframeの動画をレイアウトに合わせてCSSで自由に伸縮可能。 解像度の違う、iPhone等でも動作を確認しているそうで、どんな環境でも動画をページにフィットさせたい用途に有用です。 通常サイズ。ブロックいっぱいに広がる動画 幅をiPhoneなみに小さくしてみた例。動画も縮んでます。 IEでも動くみたいです。 これは覚えておいたほうがよさそうです。 関連エントリ フリーで新しめのXHTML/CSSで書かれたサイトテンプレート45 ぜんぶピュアCSSでやっちゃおうというJavaScriptの代替デモ56 Ajaxスタ
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く