※ページが正常に表示されない場合 AddBlockなどの広告ブロックツールがONになっていると、ページの一部が表示されないことがあります。これらのツールをOFFにしてみてください。
JavaScriptによるHTML5プログラミング入門 - libro
※ページが正常に表示されない場合 AddBlockなどの広告ブロックツールがONになっていると、ページの一部が表示されないことがあります。これらのツールをOFFにしてみてください。
JavaScriptでリアルタイムに音を鳴らす方法を3つほど - つまみ食う
最近、JavaScriptで動くMMLシーケンサーを作っています。 pico http://pico-project.appspot.com/mml/ SiONのMMLをパク参考にしているので、MMLTalks(http://mmltalks.appspot.com/)あたりのMMLをコピペすると、それなりに鳴ってくれる場合があります。思い通りになっていない部分がかなり多いですが、、 このあたりのMMLは結構聴ける(適宜コピペしてお試しください) http://mmltalks.appspot.com/m/RaKRP http://mmltalks.appspot.com/m/DIZpo http://mmltalks.appspot.com/m/jVIoz (FM音源が惜しい) で、 で、表題の件ですがJavaScriptでリアルタイムに音を鳴らすには以下の3つの方法があります。 Aud
Javascriptで音を鳴らす - yamblog
夏休みだし，javascriptでも勉強しようかと思ってゲームを作成中． （物理演算ブロック崩し みたいなの） そこで音を鳴らすのに苦労したので調査メモを残す． chromeとfirefoxで確認 方法1 divを使う 参考：Javascript play sound (wav, MP3, etc) in one line | Relentless Simplicity :: Bill Harding's Tech BlogRelentless Simplicity :: Bill Harding's Tech Blog 一番簡単で，大抵の場所で動く方法． htmlファイルに <div id="sound_element"></div> と記述し，javascriptから document.getElementById("sound_element").innerHTML= "<embed
HTML5 の File API でローカルファイルを扱ってみる
HTML5 の File API でローカルファイルを扱ってみる HTML5 の File API を使用することでドラッグ＆ドロップでの複数ファイルの取得や、ローカルファイルのちょっとした加工などができるようになりました。 この記事では、画像とテキストファイルを簡単に表示する方法をご紹介します。 投稿日2012年12月13日 更新日2012年12月13日 html html はファイルをドロップする div と表示する div を用意します。 html <p> ファイルをドロップしてください。</p> <div id="file-input"> <div class="input"></div> <div class="out"></div> </div> cssでドロップするdivを大きくしておくと良い感じだと思います。 css #file-input div.input { padd
JavaScriptでファイル操作！？ File APIを使いこなそう
連載目次 近年のWebアプリケーションでは、画像ファイルやテキスト・ファイル、Officeファイルのアップロードやダウンロードのやり取りが行われることが多くなってきている（例えば、Twitter上での画像ファイル共有やGoogleドキュメントでのOfficeファイルのアップロードなどがそれだ）。 HTML5では、ファイル操作に関するAPIとして「File API」が定義されたことで、ローカルのファイルをブラウザ上で直接、取り扱うことが可能となった。これによって、Webとローカルの違いをアプリケーションで意識しなければならない局面も少なくなる。 現在、File APIは以下の3種類の仕様が策定されている。
WebSocketによるクライアント＝サーバー通信(1/7):JavaScriptによるHTML5プログラミング入門 - libro
HTML5では、クライアント＝サーバー間の通信に関する技術も追加されています。それが「WebSocket」と呼ばれるものです。これにより、Webブラウザからサーバーに、JavaScriptで通信することが可能になります。 ……なんて説明すると、「えっ、今までもAjaxとかでできたはずじゃ？」と思うかも知れません。確かにAjaxを利用すれば、JavaScriptを利用してクライアント（Webブラウザ）からサーバーに通信をすることができます。しかし、Ajaxによる通信は、それほど高度なものではないのです。 Ajax通信は、単に「クライアントからサーバーにアクセスし、結果を受け取って終わり」ということしかできません。どういうことかというと、「通信を維持し続けることができない」ということなのです。中には、Cometと呼ばれる技術などのように、Ajaxを巧みに利用して通信し続けるようなものも登場して
双方向通信を実現！ WebSocketを使いこなそう
（1）Ajax XmlHttpRequestオブジェクト（JavaScript）を利用した非同期通信処理のこと。Googleマップを筆頭とするWebアプリケーションで活用されている。ブラウザからサーバ側に非同期でリクエストを実施してデータを受け取り、JavaScriptにより部分的にページを更新することで、ページ全体を更新するよりも低負荷でサーバと通信できる。また、通信中も操作を継続できるので、エンド・ユーザーの操作を妨げられることもなく、ユーザビリティに優れる。デメリットとして、基本的にブラウザからのリクエストで動作する仕組みなので、サーバ側から自動でデータを送信することはない。
HTML5 × CSS3 × jQueryを真面目に勉強 – #8 jQueryプラグインの作り方について詳しく | DevelopersIO
僕は人の名前を覚えるのが苦手です。それはさておき、jQueryプラグインの作成方法について頻繁に忘れるので、手順をここにまとめておくことにします。コレさえ読めば急にプラグインを大量に作れといった無茶ぶりをされても大丈夫。 多い日も安心♪（ゝω・）vｷｬﾋﾟ はじめに - jQuery プラグインの構成 細かい差はあれど、基本的にjQueryプラグインは以下のような構成で成り立っています。 // 匿名関数で全体をラップ - (5) (function($) { // このプラグインの名前 - (1) $.fn.name_space = function() { //要素を退避 - (2) var elements = this; // 要素をひとつずつ処理 - (3) elements.each(function() { // 具体的な処理をここに記述 }); // method chain
今更聞けないcanvasの基礎の基礎 - KAYAC Engineers' Blog
はじめまして。新入りのnagataです。 入社式で自転車乗ってた野郎です。 先輩方から「ブログ、書いてね！」とのお達しがあったので、 日報で書いたらウケがよさげだったcanvasのことについて書いてみようと思います。 ※各種サンプルはMac上のSafari4.05、Firefox3.6.3、Chrome5.0で動作を確認しています。 canvasってなんぞ？ 図を書き込めるhtml要素です。 OpenGLやDirectXのような面倒な設定を書くことなく、 手軽にグラフィック描画が行えます。 ブラウザだけでローカルアプリケーションのような グラフィカル（かつ動的な）表現が行えるわけです。 とりあえずつかってみる 早速何か描いてみましょう。 こういうことは実践あるのみです。 処理にはJavascriptを使います。 canvasに描画を行うときは、canvas要素からcontextを取得して、
まだまだ間に合うCanvasでアニメーション入門（まとめと実践） :: 5509
JavaScript Advent Calendar 2010も22日目！あと3日ですよ。僕はちょうど学んだばかりのCanvasをアウトプットもかねて、まとめと実践を書いてみます。知ることと行うことは同一である、最近行ったセミナーでも言ってました。 jsdo.itにはほんまにこれCanvasなん？なサンプルいっぱいありますね。あーいうの書けるようになりたいなぁとか思いつつ、jQueryばっかりさわってた僕は.animate()メソッドの便利さに取り憑かれていたので、Canvasの絵もまだ上下左右で動かすくらいしかできません。慣れが必要です。。 どうでもいい情報としてCanvasの読み方なんですけど、「キャンバス」じゃなくて「カンバス」が正しいようです。キャンバス・カンバスどっちでもよさげ。僕はキャンバスって読んでました。けどカンバスにします。 前置きはこれくらいにして、今回は次のようなカラ
わずか8KBで直感的にCanvasが使えるjQueryプラグイン「jCanvas」 | Web活メモ帳
円を書く ↑drawArcメソッドで円を書く事ができます。 オプション引数で座標位置とサイズ、色などを指定します。 $("canvas.test").drawArc({ fillStyle: "black", x: 100, y: 100 }); 短形を書いて回転させる ↑rotateCanvasで回転軸の座業と角度を指定します。 $("canvas.test").rotateCanvas({ angle: 45, x: 100, y: 100 }) .drawRect({ fillStyle: "#000", x: 100, y: 100, width: 100, height: 50 }) .restoreCanvas(); グラデーションを作成する ↑gradientメソッドでグラーデーションオブジェクトを作成し、 描画する際に指定するとグラデーションが適用されます。 var lin
無職のプログラミング HTML5 Audio オブジェクトを JavaScript で制御する方法
HTML5 の Audio オブジェクトについて調べたことをまとめる。 なお、本エントリでは Audioタグについては記述しない。 ＜注意＞以下で示すソースコードは、Firefox3.6 と GoogleChrome7 でしか検証していません。 目次 1. HTMLAudioElement オブジェクトの作成 2. HTML5 Audio およびコーデックのサポートチェック 3. 再生する Audio ファイルの指定 4. Audio ファイルの再生、一時停止、停止 5. Audio ファイルの音量変更 6. サンプルプログラム 1. HTMLAudioElement オブジェクトの作成 参考ページ： audio 要素 - HTML5 タグリファレンス - HTML5.JP JavaScriptで制御するために、Audio要素のオブジェクトを作成する必用がある。 作成方法は以下の2通り /
HTML5 AudioとJavaScriptで作った簡易ドラムマシン (jsfx バージョン) : 音楽方丈記
HTML5 AudioとJavaScriptで作った簡易ドラムマシン (jsfx バージョン) Version 1.0.1 » 解説記事はこちら » 音声ファイル読み込みバージョン(前バージョン)はこちら 2011 © 音楽方丈記 Tweet
localStorageはいい感じ
今日のネタは、HTML5で規定されているlocalStorage(ローカルストレージ)についてです。 以下、特徴をいくつか挙げてみます。 2011/07/06 イベントについて追記 ローカルにデータを保存します PCやスマートフォンなどの端末にデータを保存します。 別のサイトに行こうが、ブラウザを閉じようが、データが残っています。 localStorageの使い方としては、キャッシュ的な使い方が良さそうです。 「サーバーからデータを取得してlocalStorageに格納しておく。次にアクセスしたときはlocalStorageから取得する。もしなければサーバーに取りに行く。」 って感じで。 サーバーに取りに行かなくて済むなら処理が早くなってハッピーですね。 所詮はローカルのデータなので、データが存在することを前提にしてはいけません。 モダンなブラウザなら大概使えます IE8以上、FireFo
HTML5のlocalStorageでiPhone用Webアプリを高速化
HTML5のlocalStorageでiPhone用Webアプリを高速化：iPhoneで動かす業務用Webアプリ開発入門（4）（1/2 ページ） 今回は、iOSのSafariの中にデータを記録できる、HTML5の「localStorage」機能を使って、データの先読みとキャッシュを実現しアプリケーションの体感パフォーマンスを向上させてみます。 HTML5の「localStorage」とは localStorage（ローカルストレージ）とは、HTML5で規定されている、Webブラウザ内部のKVS（キーバリュー型データストア）です。iOSのSafariでも実装されていて、JavaScriptコードからアクセスでき、任意のデータを保存できます。 いきなり注意！ localStorageの保存データはテキストで！ HTML5の仕様では、localStorageに保存できるデータはJavaScrip
ハプニングバー大阪おすすめ人気ランキング。口コミと評判で事実を暴露
2020/01/10 (更新日: 2022/03/10) ハプニングバー大阪おすすめ人気ランキング。口コミと評判で事実を暴露 ハプニングバー 大人の社交場、ハプニングバーは大阪府内にたくさんあります。 今回の記事では大阪×ハプニングバーに視点を当てて、おすすめランキングや各店舗の特徴や雰囲気。そして料金など！徹底的にご紹介していきます。 大阪で大人の遊びを体験したいなら、ぜひぜひ気になるお店を見つけてくださいね！ ハプニングバーには一人で行く事も出来ますが、料金が少し高くなります。 その上、一人で来た男性と女性を交換してくれる人なんていないですよね。 かといって一緒に行く女性もいない方はＰＣＭＡＸに登録しましょう。 無料で女性を探せる掲示板で女性をゲットしてからいけば、料金も安くスワッピングを楽しめちゃいますよ。 無料ポイント以内で一緒に行く女性を見つける事も可能です。 無料で登録できるP
HTML5で位置情報取得 / HTML5をiPhoneのWebViewで表示させる簡易アプリ作成方法 - BASHI_BASHI
HTML5で何かアプリを作ってみようということで、 ・iPhoneアプリでHTML5を表示させる簡易Webブラウザ ・HTML5を使って位置情報を取得するサンプル を作りましたのでそのメモを。 iPhoneアプリでHTML5を表示させる簡易Webブラウザ １、View-Based Application にて、新規プロジェクトを作成 ２、ViewControllerクラスを編集 #import <UIKit/UIKit.h> @interface WebViewSampleViewController : UIViewController { UIWindow *window; IBOutlet UINavigationBar *navigationBar; IBOutlet UIWebView *webView; IBOutlet UIToolbar *toolBar; } @prope
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
大規模 JavaScript その設計と実装と現実
http://www.adakoda.com/adakoda/2010/04/html5-geolocationapi.html
iPhoneやAndroidのブラウザでHTMLベースで音を出すには？