【Web制作】HTML5のvideoタグにはMP4形式動画だけ指定すればよい（IE8対応）＠2014年末
概要 ▶ 2014年末ではほとんどのウェブブラウザーがMP4形式の動画に対応しています。videoタグもシンプルになります。非対応のIE8はライブラリーの活用を。 ●videoタグは複数ソースが設定できて便利HTML5のvideoタグでは以下のように書くことで複数のファイルソースを指定することができます。 <video> <source src="example.mp4"> <source src="example.webm"> <img src="example.gif"> </video> 上記の例だと、 最初に「example.mp4」の再生をトライ 「example.mp4」を再生できない場合、「example.webm」の再生のトライ 「example.webm」を再生できない場合、「example.gif」を表示となります。 簡単な書き方で、再生できない場合の複数のソースの指定
HTML5 & CSS3 ブラウザ別サポート状況
What is an IP Address? An IP (short for “Internet Protocol”) address is a unique number assigned to every machine that connects to the internet. Nowadays, you can have multiple computers behind a router that share a single IP using Network Address Transformation (NAT). If you have ever used a wifi hotspot to access the internet, you’ve shared an IP address with someone. What’s the Difference betwe
HTML5 videoタグを活かした、フルスクリーンの動画再生サイト
今回はSNSアプリ『Path』のWebサイトを解析していきます。Pathは、フォローしあえる友人の数を150人までに制限しているクローズトなSNS。FacebookやTwitterで必要以上にひととつながりすぎて、「本当に親しい人」の間でのコミュニケーションを楽しめないひとのソーシャル疲れを解決してくれます。全世界でユーザー数200万人と公表されています。アプリの詳細やマーケティング視点での分析はJ-CASTの記事をご覧いただければと思います。 今回はこのPathの「Webサイト」がユニークなので解析したいと思います。このサイトの一番の特徴は、フルスクリーンの動画再生サイトであることです。サイトを訪れると背景すべてが動画のインターフェースになっていて、アプリを使用している動画が自動再生されます。 フルスクリーンの動画再生ウェブサイト このサイトのポイントは、「動画」です。背景がそのまま動画
jQueryで背景に動画をフルスクリーンで表示する方法｜BLACKFLAG
海外のサイトなどで最近たまに見かける、背景に動画をフルスクリーン表示して見せる手法。 背景全面に動画が流れることでページの演出をかなりダイナミックに見せることが出来ます。 この背景動画を簡単に実装できるjQueryプラグインもありますが YouTubeにアップされている動画が対象だったりで、 任意の動画ファイルを簡単に流すことができるものが見当たらなかったので 簡単に実験的に作ってみたのを紹介してみます。 動画を流す手法はHTML5の＜video＞タグとかも考えましたが 今回は動画再生はFlashで流すパターンにしています。 まずは動作のサンプルから。 下記リンクよりサンプル画面を表示してみてください。（別枠で表示されます） jQueryで背景に動画をフルスクリーンで表示するサンプルを別枠で表示 ※サンプルでの動画ファイルは容量を軽減する為に少々粗いものになっています。 ブラウザ枠をリサイ
HTML5 を IE や Firefox 2 でも使えるようにする方法 - html5doctor - HTML5.JP
サイト内検索 この記事は、html5doctor に掲載されている記事「How to get HTML5 working in IE and Firefox 2」を日本語訳したものです。この記事では、新要素に対応していない IE や Firefox 2 で、新要素を適切にレンダリングさせる方法を分かりやすく解説しています。HTML5 でサイトを作る場合には、必須の知識となります。 原文タイトル How to get HTML5 working in IE and Firefox 2 原文ページ URL http://html5doctor.com/how-to-get-html5-working-in-ie-and-firefox-2/ 著者 Remy Sharp 氏 原文投稿日 2009-06-20 一部、直訳ではなく意訳した部分がございます。原文と表現が異なることがございますので、ご了
HTML5関連の情報源のまとめ（2012年4月版）
こんにちわ。HTMLファイ部のふちがみです。 HTML5のすごいコンテンツやニュースをキャッチアップしきれない！知らないところでバズってる！と悔しい思いをしている方も多いと思います。そこで、ミーハーなファイ部のメンバーに「どうやって情報収集をしているか」を聞いてみたのでまとめてみました。 ソーシャルブックマーク キーワード「HTML5」を含む新着エントリー - はてなブックマーク キーワード「CSS」を含む新着エントリー - はてなブックマーク キーワード「javascript」を含む新着エントリー - はてなブックマーク コミュニティー html5j.org | Google グループ ニュースサイト HTML5/CSS3の情報をクリップ！ :: dotHTML5 dotHTML5のtwitterもフォローしておくとGOOD ゲーム・ガジェット系 Kotaku JAPAN｜ザ・ゲーム情報
ゼロからはじめるHTML5でのサイト制作／最終回 ほとんどのCSSを変えずにxhtmlとHTML5で同じレイアウトを作成してみよう - MdN Design Interactive
前回までの記事で簡単なレイアウトを作成して、xhtmlとHTML5でマークアップしたものからHTML5の新要素の説明を行い、アウトラインを確認してみました。最終回となる今回はxhtmlとHTML5のCSSをほとんど変えずに同じレイアウトになるように作成してみたいと思います。 HTML5でCSSを設定する場合は新要素に対応していないブラウザに対してどうするのか。まだ確定していないHTML5の要素が変更になった場合を考慮して、スタイルの設定を考えた方が後々の大きな修正を回避できるのでベターです。ただ今回のレイアウトはほとんど同じCSSを使うということで作成するので、多少気になる部分もあるかと思いますが、ひとつの例として見ていただければと思います。 解説：（有）ムーニーワークス 林 豊／田崎一成 前回まででアウトラインを確認したそれぞれのマークアップしたページのサンプルこちらにあります。 ●HT
HTML5とあわせてチェックしておきたい、ブラウザだけで3D表現できる「WebGL」体感デモ各種 【増田(@maskin)真樹】 | TechWave（テックウェーブ）
1990年代初頭から記者としてまた起業家として30年以上にわたりIT業界のハードウェアからソフトウェアの事業創出に関わる。シリコンバレーやEU等でのスタートアップを経験。日本ではネットエイジ等に所属、大手企業の新規事業創出に協力。ブログやSNS、LINEなどの誕生から普及成長までを最前線で見てきた生き字引として注目される。通信キャリアのニュースポータルの創業デスクとして数億PV事業に。世界最大IT系メディア（スペイン）の元日本編集長を経て現在に至る。 [読了時間:4分] 期待高まるHTML5。平行してチェックしておきたいのが2D/3Dグラフィックスをウェブブラウザだけで表現できる「WebGL」というAPI(アプリケーション・プログラミング・インターフェイス)だ。HTML5で制定されるCanvas要素を使用しグラフィックを描画するもので、WebGLを搭載した最新のウェブブラウザであれば、専用
HTML5のモバイルアプリを“ネイティブアプリ化”する「PhoneGap」が正式版に。オンラインでの変換サービスも発表
HTML5のモバイルアプリを“ネイティブアプリ化”する「PhoneGap」が正式版に。オンラインでの変換サービスも発表 HTML5、CSS、JavaScriptなどのWeb標準の技術で作成したモバイルアプリケーションを、iPhoneやAndroidなどのデバイスにインストール可能なネイティブアプリケーションへと変換するフレームワーク「PhoneGap」が、正式版「PhoneGap 1.0」になったと開発元のnitobiより発表されました。 PhoneGapはオープンソースソフトウェアとして開発されているソフトウェアで、無料でダウンロードし利用することができます。 デバイスごとのネイティブアプリケーションに変換 PhoneGapを、jQuery Mobileのようなマルチデバイスに対応したモバイルアプリケーション用フレームワークと組み合わせると、HTMLやJavaScriptなどのWeb標準
アドビ、FlashをHTML5に変換するツール「Wallaby」発表
Adobe Labsは米国時間3月7日、FlashをHTML5に変換する新しい無償ツール「Wallaby」を発表した。 AdobeのMAX 2010カンファレンスで最初に披露された同ツールは現在のところ、変換はできるが荒削りな部分があるとAdobe Flash Professionalシニア製品マネージャーを務めるTom Barclay氏は述べた。「HTML5は、バナー広告やウェブパブリッシングにおいて重要な技術」と同氏は述べるとともに、Flashは、特に複雑な双方向性が必要なゲームにおいて開発者らによって多用されているということを強調した。 現状のWallabyでは、FLA形式のファイルを選択して変換すると、そのFlashファイルがHTML5、JavaScript、CSSに変換される。ほとんどの描画要素、塗りつぶし、シェイプトゥイーン、モーショントゥイーン、シンボル名、インスタンス名など
IO 9elements
Our company's top wizards, stuntmen, and industry experts offer their best advice, how-tos, and insights - all in the name of shockingly good code & design. Building a Rock Solid Auto GridExplore a customizable CSS auto-grid layout in our latest post. Adjust column widths, gaps, and max column count for flexible web designs. Ideal for any web project. Hosting a ComfyUI Workflow via APIBasic WebSoc
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
WebGL Bookcase
Engadget | Technology News & Reviews
http://virtualpark.mozilla.org/
5509.me