HTML5/JavaScriptによる電子書籍風フリップアニメーション·Turn.js MOONGIFT
Turn.jsはHTML5/JavaScript製のオープンソース・ソフトウェア（BSD License）です。 電子書籍というとePubファイルが有名ですが、HTML5でも実現は可能です。特に紙をめくった時のようなフリップアニメーションが欲しい時にはTurn.jsを使ってみましょう。 デモです。幾つかのサンプル書籍が掲載されています。 開きました。 フリップしています。 別な書籍。マウスをもっていくと端が折れ曲がります。 こんな感じで斬新な表示も。 マガジン風の使い方もできます。 デモ動画です。 Turn.jsではめくる操作はもちろんのこと、拡大表示もサポートされています。デスクトップブラウザはもちろん、iPhone/iPadによる操作も可能です。コンテンツはAjaxによる動的取得にも対応しています。一部HTML5非対応ブラウザでも使えるようになっており、対応ブラウザはIE8からとなって
クロスプラットフォーム対応モバイルサイトを構築するために必要なファイルをまとめた -Mobile Boilerplate
HTML, CSS, JavaScriptをはじめ、sitemap.xml, .htaccessやアクセス解析など、モバイルサイトを構築するファイルをまとめた「Mobile Boilerplate」を紹介します。 「Mobile Boilerplate」はjQuery MobileやSencha Touchなどと相性がばっちりだそうです。 Mobile Boilerplate [ad#ad-2] Mobile Boilerplateの特徴 クロスプラットフォーム対応（Android, iOS, Blackberry, Symbian） CSSはIE Mobile 7をターゲット ホームスクリーンアイコン（Android, iOS, Symbian） ビューポートの最適化（Opera Mobile, Android, iOS, IE, Nokia, Blackberry） ビューポートのスケ
プロフェッショナル用のHTML5+CSS3+jQueryのテンプレート -HTML5 Boilerplate
プロフェッショナル向きに開発された、HTML5+CSS3+jQueryなど直接実装に関わるファイルから、robots.txt, .htaccessなどサーバー関連のファイルも一式にまとまったテンプレートを紹介します。 HTML5 Boilerplate 昨日、当サイトで紹介した「HTML5 Reset」もHTML5+CSS3をベースに開発されたテンプレートセットですが、こちらはよりプロフェッショナル向けに開発されたものとなっています。 下記にその特徴を。 HTML5 Boilerplateの主な特長 クロスブラウザ対応（IE6も） HTML5対応 キャッシュの最適化と圧縮でGrade-Aのパフォーマンス モバイルブラウザへの最適化 クロスブラウザ対応のためにIEでは特定のclassを用意 プリント用のスタイルシート、パフォーマンスの最適化 HTML5でより早いページロードにする「.htac
HTML5のアニメーションを簡単に作成できるサイト「HTML5 MAKER」 | ライフハッカー・ジャパン
「HTML5 MAKER」はHTML5のアニメーションを簡単に作成できるサイトです。HTML5でアニメーションを作るのが簡単に行えますよ。ドラッグ＆ドロップで画像やテキストを追加し、アニメーションをつけることができます。PowerPointと似たような動作でHTML5のアニメーションが完成します。 以下に使ってみた様子を載せておきます。まずHTML5 MAKERへアクセスしましょう。登録不要で作成できるので、早速「CREATE ANIMATION」からアニメーションを作ってみましょう。 このように、画像やテキストを追加していきます。下部にアニメーションの設定がありますよ。開始時のアニメーションや終了時のアニメーションが設定できます。左側にスライド一覧があります。一つ前のスライドを複製できるので、連続したアニメーションを使うときに便利ですね。完成したら、「Save」するとHTML5形式でまる
HTML5 CanvasとCSS3のスマホブラウザでの描画性能 - ICS MEDIA
スマートフォンのブラウザでどの程度のグラフィック表現が可能なのか、性能が気になりませんか？ 近年、HTML5を利用できる分野はウェブサイトのみならず、ゲームやSPA（シングルページアプリケーション）など多岐に渡っています。そこで、本記事ではiOSやAndroidの新旧さまざまな端末を使ってパフォーマンスを検証。記事の前半では描画性能を、後半ではJavaScriptの計算性能を測定しています。 描画性能の検証ビデオをご覧ください さまざまな端末を使って、描画検証の様子を録画しました。この80秒の動画では画像のオブジェクトの表示可能な個数を測定しています。ビデオの後半が見どころで、iPhone 5のパフォーマンスが良すぎてビデオを早送りするほどスコアがでるまで時間がかかっています。 さまざまな端末のスコアを測定しました 次の表に、2012年までに発売されたスマートフォンのスコアを掲載しました。
HTML5とCanvasでアプリを作れるフレームワーク「iio Engine」:phpspot開発日誌
iio Engine Home HTML5とCanvasでアプリを作れるフレームワーク「iio Engine」 物理エンジンや当たり判定、アニメーションのライブラリ等が含まれていて、ゲームなどを作る場合に使えそうです。 HTML5でゲームを作る際の選択肢の１つとして知っておいても良さそう デモページを見れば大体どういうものかは分かるはず 関連エントリ HTML5を使った超クールなフリーのWordPressテーマ集35 HTML5を使ったクールなサイトデザイン集２１ 高機能なHTML5お絵かきツールを実装できるjQueryプラグイン「jquery.deviantartmuro」 30以上のリッチコンポーネントが詰まったHTML5のUIライブラリ「Zebra」 クールでアニメーションするグラフを描画できるHTML5チャートライブラリ「Chart.js」 HTML5のゲームエンジン「Quintu
HTML5 にまつわる誤解を解く
原文: HTML5 mythbusting on November 1, 2012 by Chris Heilmann HTML5 の実用性を巡って昨今繰り広げられている議論は、多くの間違った憶測に基づいています。それは、一度言われてからずっと繰り返されている、そして多くの場合正しいのかどうかまったく検証されていない、HTML5 に関する誤解につながっています。 HTML5 は遅い？ HTML5 の問題について話したがる人たちが必ず主張することと言えばパフォーマンスです。ここでの一番の問題は、そうした比較のほとんどがリンゴとナシの比較に過ぎないという事実を見落としている点です。 HTML5 アプリとネイティブアプリのパフォーマンスを比較することは、オーダースーツと既製品のスーツを比較するようなものです。もちろんオーダースーツは手袋のように体になじみ、見た目は素晴らしいですが、もし後でそれを
Dot Com Infoway Releases HTML5 Infographic - Dot Com Infoway
Dot Com Infoway (DCI) has recently unveiled a new infographic titled ‘HTML5-Past, Present & Future’ which explains the evolution, key features and capabilities of HTML5 in an informative and interesting manner. HTML5 has an edge over its predecessors with top-notch features and supports a variety of current media devices and Web browsers. HTML5 is the next evolutionary step for the Web world. With
コンテンツカテゴリー - HTML: ハイパーテキストマークアップ言語 | MDN
HTML チュートリアル HTML の基本 HTML 入門 HTML 入門の概要 HTML を始めよう ヘッド部には何が入る? HTML のメタデータ HTML テキストの基礎 ハイパーリンクの作成 高度なテキスト整形 文書とウェブサイトの構造 HTML のデバッグ 評価課題: 手紙のマークアップ 評価課題: コンテンツのページの構造化 マルチメディアとその埋め込み マルチメディアとその埋め込みの概要 HTML の画像 動画と音声のコンテンツ object から iframe まで — その他の埋め込み技術 ウェブへのベクターグラフィックの追加 レスポンシブ画像 評価課題: Mozilla のスプラッシュページ HTML の表 HTML の表の概要 HTML の表の基本 HTML 表の高度な機能とアクセシビリティ 評価課題: 太陽系の惑星データの構造化 リファレンス HTML 要素 <a>
HTML5の｢コンテンツ・モデル｣と｢カテゴリー｣を理解してマークアップするためのまとめ | Mnemoniqs Web Designer Blog
PCサイトのコーディングではまだまだHTML4で行うことも多いですが、最近ではスマートフォンの案件も増え、HTML5でマークアップする機会が多くなってきました。 先日の記事、「うやむやにしていたHTML5の文書論理構造をきちんと考えてみる」では基本的な文書論理構造のフローチャートを載せました。今回はHTML5をマークアップするうえで無視できない『コンテンツ・モデル』について、自分の理解を深める意味でも、改めてまとめてみようかと思います。 目次 『コンテンツ・モデル』を理解する必要はあるの？ 『コンテンツ・モデル』って一体なに？ 『コンテンツ・モデル』の主要カテゴリー 注意！「カテゴリー」＝『コンテンツ・モデル』ではない 『コンテンツ・モデル』をもとにしたタグの配置ルール トランスペアレント・コンテンツとは？ まとめ 『コンテンツ・モデル』を理解する必要はあるの？ HTML4でマークアップし
HTML5で再定義された要素と属性 ここが違う！サンプルで見るHTML5（3）
はじめに この連載では、今日のウェブ業界の流行語となっている「HTML5」をとりあげ、全6回に分けて、これまでの技術とどのような違いがあるのか、具体的にサンプルのコードを示しながら解説していきます。 過去の連載も読む 第1回：HTML5が注目を浴びる理由とは？ 第2回：HTML4から変化したHTML5のマークアップ 要素はスタイルを表さない HTML5は、新たに追加された要素に注目されがちですが、旧来から使われてきた要素についても再定義しています。 HTML4やXHTML1.0で規定された要素には、スタイリングを指示する要素がありました。HTML5では、スタイリングはCSSに任せ、要素はセマンティクスのみを表すことに重点が置かれています。そのため、HTML5のすべての要素から、スタイリングを指示する意味合いが完全に排除されています。 実際に、スタイリングを指示するだけの要素は、HTML5で
HTML5のCanvas図形をクリッカブルにするjQueryプラグイン ClickableCanvas - ウィザード・コード | WIZARD-CODE
ClickableCanvasの概要 jQuery ClickableCanvasは、HTML5のグラフィック機能であるCanvasで描かれた図形に、一部のマウスイベントをバインドするjQueryのプラグインです。 図形にマウスを合わせたり、図形をクリックしたタイミングでDOMイベントのようにコールバック関数を呼び出すことができます。 Internet Explorerはバージョン8までCanvas要素に対応していないものの、FlashCanvasやExplorerCanvas、 uuCanvas.jsをページ内で呼び出すことで同等の機能を持たせることができます。 jQuery Clickable Canvas バージョン２を公開しています。詳しくはこちらのデモページへ！ 10/11/18 Canvas機能をInternet Explorerで実現するライブラリFlashCanvasに対応
TechCrunch | Startup and Technology News
Live Nation says its Ticketmaster subsidiary was hacked. A hacker claims to be selling 560 million customer records. An autonomous pod. A solid-state battery-powered sports car. An electric pickup truck. A convertible grand tourer EV with up to 600 miles of range. A “fully connected mobility device” for young urban innovators to be built by Foxconn and priced under $30,000. The next Popemobile. Ov
JavaScript Canvas JS: Casino Game and fast payments oriented
basicsloaderclearclone/cacheSizetrimcropresizeTransformationalignstarsDrawingalpha/restoredrawRegionborderImageimageLineoutlinePathscirclestrokeCirclefillCirclestrokeLinepolygonroundRectTextpixelFontfontHeightwrappedTexttextBoundariestextBaselineBlending and colorblendsetHslshiftHslnegativematchPalettegetPalettegrayscaleToMaskapplyMaskpixelColor utitlities Canvas Query for Sofortauszahlung casino
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
http://html5snippets.com/
IDEA * IDEA
404 Not Found - Josh Duck
Mobile HTML5
第二回全国統一 HTML5実力テスト - jsdo.it - Share JavaScript, HTML5 and CSS
HTML5 の Web制作を 確実に楽にする最新の アドビWeb制作ツール for HTML5 Carnival Fukuoka
