html5mediaでIE6,7,8でもHTML5で動画再生 – CamCam
これまでPCサイトでの動画再生といえばFLVが主流。 がしかし、iPhone iPadではFlash非対応で再生できない。ジョブズも時代はHTML5だと頑なにFlashを拒否してたのは周知の通り。 そんなこんなで時代の流れは脱Flashへと向かう中、アタクシ自身もかなり以前からFlash嫌いだったこともあって、Webでの動画再生はHTML5でやりたい。 そうなると次なる問題は、Flash以上にいかんともしがたい IE6,7,8 HTML5をまったく理解しないアホブラウザどもだ。 IEを抹殺しない限り地球に平和は訪れないとすら思える。 しかし時代はあっさりこの問題もクリアしてしまった。 html5media HTML5 video and audio tags in all major browsers これで、IE6-8でも問題なくHTML5のvideoタグを使って動画を再生できる。 ダウ
IE6,7,8でもHTML5で動画再生 【video.js編】 – CamCam
以前紹介したhtml5mediaも再生だけなら十分ですが、video.jsは動画再生周りのイベント処理が充実しています。 VIdeo JS video.jsも他のライブラリと同様に、videoタグに対応していないブラウザでは付属のswf経由で動画ファイルを再生します。 設置も簡単。まずはお約束のjsとcssの読み込み <link href="path/to/video-js.css" rel="stylesheet"> <script src="path/to/video.js"></script> <script> //swfファイルを別のディレクトリに置く場合 _V_.options.flash.swf = "path/to/video-js.swf" </script> <video class="video-js vjs-default-skin" width="640" heig
スマートフォンでのvideoタグ操作（自動再生の試行錯誤） | SpiriteK Blog
初めまして、河村です。 これからしばらくはスマートフォンのwebアプリに関することを記事にしていこうかなと思っています。 webアプリといっても、単にjavascriptでサーバとajaxでやり取りした結果を出すだけ、というところに留まらず、css3やhtml5を積極的に取り入れていこうと思っていますので乞うご期待。 初回である今回は、スマートフォンやタブレットでhtml5のvideoタグを扱う案件の中から、ポイントだけを抜き出してお話したいと思います。 今回扱うプラットフォームはiOS4.2以上のiPhone（Androidデバイスは持ち前がないので検証はまたの機会に）、確認のためのPC版safari5。 まずやりたいこととしては、 「ページがロードされたらvideoで指定されているmovieを自動的に再生したい」 というのがあります。 しかしこれがまた単純に自動再生できない。例えば以下
HTML5のvideoとcanvasで動画のキャプチャを取る | Web | position: absolute;
このエントリーはGraphicalWeb (CSS, SVG, WebGL etc) Advent Calendar 2012の19日のエントリーになります。 先日CSS Nite LP, Disk 25：Webデザイン行く年来る年（Shift6）に参加しました。その時にこのAdvent Calendarを起こしたoyamadaさんにもう「ひとつエントリー書いて」と言われましたので、ちょっと小ネタですが19日めとして登録しておきます。 動画のキャプチャを取る方法は様々ありますけど、HTML5でも手軽な方法でできますよということで。 サンプル ※動画はW3Cのサイトで利用されていたものを拝借しました。 「snapshot」というボタンを押すと再生中の動画のキャプチャを撮ってHTML内に挿入します。imgタグで入ってますので大抵の環境であれば右クリックで保存できます。 コードの解説ですが ca
HTML5で動く10の動画プレイヤー - SEO Japan｜アイオイクスのSEO・CV改善・Webサイト集客情報ブログ
SEOにもHTML5が重要などといわれる時代になってきましたが、HTML5といえばプラグインなしでデバイスとらわれず動画やアニメーションが再生できるのが大きな魅力ですよね。HTML5の動画プレイヤーは既に多数リリースされていますが、今回はその中から実際に使えるものを10厳選して紹介した記事をspyrestudiosから。 — SEO Japan 動画プレイヤーにはあまりに多くの選択肢があるため、どのアプリケーションが自分に最も相応しいのか選択するのは難しい。私なら、物事を複雑化しないことと、動画プレイヤーの更新、新機能、バグ修正という将来の頭痛の種を避けることをお勧めする。その全てに対処し、あなたの仕事を簡単にするオンラインベースの動画プレイヤーにこだわるのだ。物事を行うことや物事を複雑化しないことのより簡単な方法に関心があるなら、www.wix.comもチェックするといいかもしれない。
15 Free HTML5 Audio Players For Your Website and Blogs
HTML5 is sure to be a big hit this year as far as web design trends go, and rightfully so. It’s new, exciting, easy to understand and better than anything that has come before it. Up until recently, we have had to navigate a grey area in terms of compatibility and definition, and as a result, many of the early adoptions of HTML5 have been partial or complete disasters. The first thing to understan
canvasでキラキラした背景を作る方法 - KAYAC Engineers' Blog
tech.kayac.com、ささやかにリニューアルしました！ tech.kayac.comをご覧の皆さん、はじめまして。意匠部ME課のfuchigamiといいます。 どうして技術部ブログに意匠部の野郎が？って感じですが、 技術部ブログのリニューアル記念ということで、ちゃっかりcanvasについて記事を書こうと思います。 最初なので、、、 簡単にぼくの属性を説明すると、html5とか好き、CSS3とか好き、canvasとか興味ある、非モテ、javascriptはjQueryがなんとなくわかる程度、非リア充。こんな感じです。 今回のリニューアルではコーディング全般を担当しました。 特に、プログラミングに関してはド素人だ！ということを強調しておきます。 そんなぼくが、canvasを使ってキラキラした背景を作ってみました 「リニューアルするからには新しいことがやりたいよね。だったらhtml5とc
Hype
Animate in a Snap Tumult Hype’s keyframe-based animation system brings your content to life. Click “Record” and Tumult Hype watches your every move, automatically creating keyframes as needed. Or, if you’d prefer to be more hands-on, manually add, remove, and re-arrange keyframes to fine-tune your content. It is easy to create natural curves by clicking and dragging on an element's motion path to
WWW.AKIRAFUKUOKA.COM BLOG | 今VJするならブラウザででしょ！ HTML5でVJアプリ「Fi-VJ」を制作しました
HTML5ならのVJアプリだって作れるはず！で、作りました Fi-VJ ver1.02 デモページはこちら ファイルダウンロードはこちら (ver1.02) DLしたら@akirafukuokaに声をかけていただけると嬉しいです!! Fi-VJ(ファイブイジェイ)というVJアプリを極々個人的に制作しました。MacのネイティブアプリでもなければiPhone/iPadアプリでもありません。ブラウザで動くHTML5-VJアプリです。確認済み動作環境はMac版Safari 5.0.5だけです。他のブラウザでは確認してません（デモページはSafariとChromeで動くようですが）。というかローカル実行ではSafari以外ではまず動きません。これに関する解説は後ほど。 ここ数年ビデオミキサーにiPhoneやiPodを繋いでプレイしていた私ですが、そろそろPCを使ったVJに戻ろうかと思ったのがちょうど
css-eblog.com - このウェブサイトは販売用です！ - css eblog リソースおよび情報
This webpage was generated by the domain owner using Sedo Domain Parking. Disclaimer: Sedo maintains no relationship with third party advertisers. Reference to any specific service or trade mark is not controlled by Sedo nor does it constitute or imply its association, endorsement or recommendation.
HTML5とは何かを簡単にまとめてみた
ヤフー株式会社は、2023年10月1日にLINEヤフー株式会社になりました。LINEヤフー株式会社の新しいブログはこちらです。LINEヤフー Tech Blog はじめに こんにちは。R＆D統括本部 制作本部 ウェブデベロップメント部に所属しております。岡部和昌（@kzms2）と申します。 最近スマートフォンやタブレット向けのページを作成する機会が増えてきました。 なので、今回はちまたで大人気のHTML5について書きます。 若干今更な内容にも思えますが、あまりHTML5になじみがない方にもわかってもらえるような内容にしています。 HTML5の基本概念や思想・実際の組み方というよりも、 HTML5で組むと今までと比べて何が違うのか などについて書いていきます。 なぜこれからHTML5なのか HTML4との違いがわからない HTML5を使う利点がわからない など疑問に思っている方はぜひ見ていた
HTML5 VideoでiPadがデジタルサイネージに！
デジタルサイネージは日本語にすると「電子看板」で、室内・屋外に電子機器を利用して掲示する広告のことです。写真や文字をスライド表示したり、派手なCGや動画を表示したりと、さまざまなタイプがあります。デジタルサイネージは、iPad本体だけでも標準のスライド機能やミュージックビデオなどを使えば簡単に実現できますし、アップルが用意している「iPad Dock Connector - VGAアダプタ」で外部ディス プレイやプロジェクターと接続すると、より大きな画面に広告を表示できます。 今回はこのVGAアダプターとiPad、HTML5 Videoを組み合わせて、大画面で動画を再生するデジタルサイネージを作ります。HTML5なら、専用のアプリケーションを作らなくても手軽にサイネージ用のページを作成できます。 なお、今回のサンプルではiPadのWiFiモデルを使用し、通信回線もWiFiの利用を前提にして
1時間で携帯サイトをスマートフォン対応にする方法 | GREE Engineering
初めての投稿となります。エンジニアのmatsuです。 携帯向けウェブサイトを1時間でスマートフォン対応する方法を紹介します。 概要 2011年4月7日のニュースにて携帯電話の新規契約数のうち、スマートフォンが占める割合が50%を越え、スマートフォンが本格的に普及する兆しが見えてきました。 現在、スマートフォン向けサイトを新規構築するためのチュートリアルは数多く出ていますが、既存の携帯サイトをスマートフォンに最適化する方法があまり紹介されていないのでこの記事で紹介したいと思います。 このチュートリアルを行うと以下のようになります。 実装 全部で8ステップあります。 このチュートリアルではブログのトップページを例にとって説明します。 前半では文字コードの変更、HTMLの変更といった構造を変更します。後半では絵文字や文字スタイルを行い、仕上げとしてHTML5のバリデーションを行っていきます。最初
Swiffy スゲエ！
Adobe FlashやAdobe Animateのタイムライン派のためのアニメーションテクニック トップ | ドローイング | アニメーション | 指導書 | 絵コンテ | 参考書 | 副読書 | 裏話 | FLASH | オススメ | ダウンロード | 日本のFlash史 さて、Flash→HTML5と言えば、アドビのWallabyっていうFLAからHTML5を生成するツールがあるよね。以前のエントリーでを試したときはメッタメタだったんだけど、同じムービーをSwiffyで変換してみたよ。 結果はこちら。 どうよ！見事に再現されてますね！すげ〜！Gifアニメじゃないよ！同じFLAから書き出したSWFや、MOVと比べても遜色がなく、Swiffyがいかにいい仕事してることがよくわかります。オレのiPodでもバッチリ！でもフルスクリーンにならんものか…。誰かおせーて！お願い。 結論タイムライン
HOPS Laboratory | もっと、創造的に。
HOPS Laboratoryでは最新のWeb技術を研究しています。ホップスの辻です。 今なにかと話題のHTML5。先日はcache manifest（キャッシュマニフェスト）のお話をしましたね。 HTML5のcache manifest（キャッシュマニフェスト）を導入してみよう！ HTML5の中でも今もっとも注目度の高い機能に「canvas（キャンバス）」というものがある。このタグを使うと、javascriptと組み合わせて簡単に図形を書いたり、アニメーションをしたりできます。Flashではプラグインという形でFlash Playerを入れなければいけませんが、canvasはブラウザ側が既に実装しているので何も必要ありません。 今回は今もっとも熱いcanvas（キャンバス）タグを使って、醤油ラーメンを描きたいと思います。 canvas使ってモテたい！でもその前に・・・ ようしcanva
MASAYUKI DAIJIMA | Technical Director / Interaction Designer
日本生まれのテクニカルディレクター、インタラクション・デザイナー、フロントエンド・デベロッパー、VJ。 表現と技術で人をワクワクさせられるモノづくりをしたいと常日頃から考えている。クラフトマンシップにこだわり、自分を研鑽していける日々を過ごせたら本望だと個人的には思っており、消費の速いデジタル作品においても長く残るモノ、せめて次の世代の人たちに触れてもらえるモノを作ることが最終目標である。 2007年5月、株式会社アーキタイプを共同設立。数々の企業のプロモーションやブランディング等に伴うWebサイト、インスタレーション、アプリケーション開発等、デジタルなプロジェクトのテクニカルディレクションやプログラミングに携わる。国外でのデジタル広告賞の受賞が多い。2017年1月、心から自分のやりたいことをしたいと強く思うようになり、設立10年を節目にアーキタイプを退職し、留学のため渡英。ロンドンにて1
eラーニング教材もワンクリックでiPad対応？Flash→HTML5変換ツールAdobe Wallabyを試してみました
Flashファイル（.fla）をHTML5にコンバートするツール、Wallaby（ワラビー）のpreview 1が、Adobe Labsにて公開されました。 ■ Adobe Wallaby （Adobe Labs） eラーニング教材はアニメーションやナレーション音声などを多用するので、Adobe Flash（.swf）で作成したコンテンツが多いと思います。しかしせっかく作成した学習教材ですから、iPhoneやiPadなどでも利用していただきたいですよね。 その願いがアドビ純正ツールとして（プレビュー版ですが）ついに登場です。 さっそく試してみました！ 以前にFlashで作成したSATTのデジタル年賀状コンテンツを、Wallabyで変換したものがこちらです。 ！注意！ HTML5版は「Safari（PC、iPadなど）」または「Google Chrome」でしか正しく表示されません。 IE、
BeerCamp at SXSW 2011
Get ready for battle. This year, the BeerCamp competition will take form in a flip cup tournament. Team registration is now complete. Each member of the winning team will walk away with a Flip HD Video Camera. Tournament will consist of 32 teams, single elimination. Matches are best-of-3 games. First team to win 2 games wins the match. Teams consist of five players. All teams must sign up with fiv
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
「金融機関等コンピュータシステムの安全対策基準」（FISC 安全対策基準）に対する Azure の対応状況リストを公開 - MSDN Blogs
Maersk - The world’s largest container shipping company
