This domain may be for sale!
会社ブログ「あゆたジャーナル」始めました。 [新着情報]あゆたジャーナルにてHTML5の開発ツール「Adobe Edge Animate」の入門記事を掲載しました。 このページでは、HTML5のAPIを利用した簡単なサンプルを公開しています。このサンプルの多くは、2010年度まで弊社技術顧問を担当していただいた白石氏がマイコミジャー ナルに寄稿した記事で使用したプログラムを元に、多少の改変を加えたものです。どれも非常にシンプルなものではありますが、HTML5の各 機能を試すためのとっかかりとしてご利用頂けると思います。 白石氏が寄稿した記事はこちらになります。これらの記事と合わせてサンプルをご利用になって頂く事で、各機能の理解がより深まることでしょう。 詳解! HTML 5と関連APIの最新動向 - 新タグ&API編 詳解! HTML 5と関連APIの最新動向 - Webアプリ開発編 アプ
6. • 現在の要素数は108 • 30種類の新要素 • 14種類の既存要素が変化 • time要素、hgroup要素、data要素 (WHATWG HTMLのみ)などが争 点。 HTML5マークアップ 7. • リッチな入力フォーム、新たなフォーム要素、宣 言的なバリデーションなど。 date datetime datetime-local month week time number range email url search tel color HTML5 Forms 8. • HTMLにマシンリーダブルなデータを埋 め込むための仕様 <div itemscope> <p>お名前: <span itemprop="name">白石</span></p> <p> : <time itemprop="birthDate">1978/03/24</time> </p> </div> HT
今更ながら、ここもHTML5にしてみようかなという気持ちが湧いてきています。以前は、一旦公開した文書の形式を無闇に変えるのはよくないという思いが強かったのですが、個人のページなのだし色々と実験的なことをもっと試してもいいのでは、と思うようになったので。 さて、HTML5導入にあたり一番気にしていたのが、IEでHTML5の新しい要素を使う方法のことでした。今だと html5shiv を使って以下のようなコメントを入れるのが一般的になっているようです。 <!--[if lt IE 9]> <script src="//html5shiv.googlecode.com/svn/trunk/html5.js"></script> <![endif]--> しかしながら、HTML文書というのは様々な環境で利用されるための文書形式だと自分は考えているので、その中に(コメントとは言え)特定のブラウザのた
Test a feature Our partnership with BrowserStack now lets you test your website for compatibility across 2,000+ real browsers and devices. Test on: Did you know? Next If a feature you're looking for is not available on the site, you can vote to have it included. Better yet, if you've done the research you can even submit it yourself! You can import usage data from your Google Analytics account and
Geolocation API Specification Level 2 W3C Working Group Note 6 July 2017 This Version: https://www.w3.org/TR/2017/NOTE-geolocation-API-v2-20170706/ Latest Published Version: https://www.w3.org/TR/geolocation-API-v2/ Previous Version: https://www.w3.org/TR/2011/WD-geolocation-API-v2-20111201/ Latest Editor's Draft: https://dev.w3.org/geo/api/spec-source-v2.html Editors: Andrei Popescu, Google, Inc
File API: Directories and System W3C Working Group Note 24 April 2014 This version: http://www.w3.org/TR/2014/NOTE-file-system-api-20140424/ Latest published version: http://www.w3.org/TR/file-system-api/ Latest editor's draft: http://dev.w3.org/2009/dap/file-system/file-dir-sys.html Previous version: http://www.w3.org/TR/2012/WD-file-system-api-20120417/ Editor: Eric Uhrhane, Google Copyright © 2
File API: Writer W3C Working Group Note 24 April 2014 This version: http://www.w3.org/TR/2014/NOTE-file-writer-api-20140424/ Latest published version: http://www.w3.org/TR/file-writer-api/ Latest editor's draft: http://dev.w3.org/2009/dap/file-system/file-writer.html Previous version: http://www.w3.org/TR/2012/WD-file-writer-api-20120417/ Editor: Eric Uhrhane, Google Copyright © 2014 W3C® (MIT, ER
html5では、file apiが追加された為、ドラッグアンドドロップでfileを開けるようになったようなので、試しに書いてみました。 ※html5では、FileReaderクラスとFormDataクラスを使うようですが、firefox3.6では、FormDataが使用できないようなので、base64形式+jquery.param()なデータをjquery.post()でアップロードしています。 ※drag&dropでは画像のサムネイルやテキストファイルの内容もプレビューできます サーバ側の動作は確認していませんが、なんとなく理解できた気がします。 <html> <head> <meta charset="utf-8"> <title>drag & drop file upload</title> <script type="text/javascript" src="jquery-1.4
現在W3Cで仕様策定が進められているFile APIを使うと、JavaScriptからローカルファイルの情報や内容にアクセス出来るようになります。 Firefoxでは3.0時代から似たような機能が実装されていたようですが*1、今回やや仕様を変更した上で標準化されます。 まだワーキングドラフトの段階ですが、Firefox 3.6 RC1*2に既にほとんどのAPIが実装されていますので、今すぐに使ってみることができます。 そこで、試しにこんなサンプルを作ってみました。Firefox 3.6で以下のページにアクセスしてみてください。 JavaScriptでネガポジ反転 ファイル選択欄でビットマップファイル(.bmp)を選択、あるいはブラウザにドラッグアンドドロップすると、その画像をネガポジ反転(階調の反転)して表示します。複数選択も可です。*3 *4 ↓実行例 ファイル加工の際にサーバと一切通信
Geolocation W3C Recommendation 15 August 2024 More details about this document This version: https://www.w3.org/TR/2024/REC-geolocation-20240815/ Latest published version: https://www.w3.org/TR/geolocation/ Latest editor's draft:https://w3c.github.io/geolocation/ History: https://www.w3.org/standards/history/geolocation/ Commit history Test suite:https://wpt.live/geolocation/ Implementation report
File API W3C Working Draft, 24 May 2024 More details about this document This version: https://www.w3.org/TR/2024/WD-FileAPI-20240524/ Latest published version: https://www.w3.org/TR/FileAPI/ Editor's Draft: https://w3c.github.io/FileAPI/ Previous Versions: https://www.w3.org/TR/2023/WD-FileAPI-20230206/ History: https://www.w3.org/standards/history/FileAPI/ Feedback: GitHub Inline In Spec Editor:
HTML5 および、それに関連する仕様に規定された API がブラウザーに実装されているかをチェックします。 HTML5 HTML Canvas 2D Context Web Storage File API HTML5 Web Messaging Selectors API Level 1 Selectors API Level 2 Web Workers Geolocation API Server-Sent Events Element Traversal この API チェッカーは、厳密に、HTML5 仕様に準拠しているかどうかを調べているわけではありません。IDL 属性(プロパティ)については、得られたオブジェクトのコンストラクタ名または型を評価しています。メソッドについては、それが Function 型かどうかを評価しているだけです。そのため、実装していると結果が出たとしても、
HTML5のDrag and Drop APIは、Insider.NETの読者諸氏ならば習得が容易なはずだ。なぜなら、ドラッグ&ドロップの実装方法が.NET FrameworkのWindowsフォーム・アプリケーションのそれと類似しているからだ。 HTML 5のDrag and Drop APIの実装方法は「ドラッグ操作」と「ドロップ操作」に切り分けて考える必要があるが、この考え方はずばりWindowsフォーム・アプリケーションのそれと同様である。これは、Drag and Drop APIの設計にマイクロソフトが大きな影響を与えている点に由来している。 WHATWG(Web Hypertext Application Technology Working Group)がHTML5の仕様策定を進める際、「先進的な機能を実装しているブラウザの挙動を規格化する」という基本理念があった。マイクロソ
HTML5 の Drag and Drop API を使うことで、ブラウザにドロップされたファイルの情報を扱うことが出来ます。そして File API を組み合わせることで、ファイルの中身まで扱うことが出来るようになります。 そして FormData オブジェクトと XHR を組み合わせることでアップロード処理までを実装することが出来ます。完成図はこんな感じです。 今回は JavaScript の処理が中心です。jQuery を使っているので追加してくださいね。 $(function () { var uploadFiles = function (files) { // FormData オブジェクトを用意 var fd = new FormData(); // ファイル情報を追加する for (var i = 0; i < files.length; i++) { fd.append(
DataTransfer.dropEffect 現在選択されているドラッグ&ドロップ操作の種類を取得したり、新しい操作の種類をセットしたりします。値は none, copy, link, move のいずれかです。 DataTransfer.effectAllowed とりうるすべての操作の種類を与えます。none, copy, copyLink, copyMove, link, linkMove, move, all, uninitialized のいずれかです。 DataTransfer.files データトランスファーが保持していて利用可能なすべてのローカルファイルのリストを保持します。ドラッグ操作がファイルのドラッグによるものではない場合、このプロパティは空のリストになります。 DataTransfer.items 読取専用 全てのドラッグデータのリストである DataTransf
Full-stack, functional reactive web programming for .NET Develop microservices, client-server web applications, reactive SPAs, and more in C# or F#.
F# Advent Calendar 2011 の4日目の参加エントリーです。 詳しくは http://partake.in/events/1c24993a-c475-4fc2-bca4-7a1cd2f81869 を。 本当は F# 3.0 の TypeProvider 機能を使って WPF のカスタムプロバイダーを紹介しようと思ったんですが、 微妙にまだ未完成なのでやめときます。 ということで今日は WebSharper やります。 ※ 3日目担当の liner_lock さんの記事見たときは、かぶってるかと思って心臓止まるかと思いました。事実ちょっとかぶってますけど・・・。 WebSharperとは? 通常、.NET で Web アプリケーションを作成するとしたら ASP.NETやASP.NET MVC を使うかと思います。 ASP.NET(MVC) でもF#は使えないこともないですが
The Internet Explorer 9 Guide for Developers provides a look at the features and improvements in Internet Explorer 9. By using this guide, web developers and designers can take full advantage of these enhancements. Developers can also experience the platform in action using the Internet Explorer Test Drive. Introduction Welcome to Windows Internet Explorer 9. As a developer, you want to know the l
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く