こんにちは! 今日はファミコン時代のあのゲームのようなエフェクトを実装するチュートリアルをご紹介します。 デモ 実装する手順 jQueryの読み込み jQueryを使用するので、Google AJAX Libraries APIからjQueryを読み込みます。 HTMLの<head>内に次の行を追加してください。 <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script> HTML デモのように各行毎にフェードインを実装するには、それぞれの行毎に<span>タグで囲い、<br>タグで改行します。 <p> <span>むかーし むかし あるところに</span><br> <span>おじいさんと おばあさんが いました</span>
var DELAY_SPEED = 1750;//読み込みの遅延時間 var FADE_SPEED = 1750;//表示のアニメーション速度 $(document).ready(function(){//ドキュメントのオンロード時に実行 $('span').each(function(i){//セレクタで指定した要素すべてに $(this).delay( i * DELAY_SPEED ).animate({opacity:'1'}, FADE_SPEED);//フェードインを適用 }); }); <p> <span>むかーし むかし あるところに</span><br> <span>おじいさんと おばあさんが いました</span><br> <span>おじいさんは やまへ しばかりに</span><br> <span>おばあさんは かわへ せんたくに いきました</span><br>
モバイルゲーム 物凄い勢いで勃興したモバイルゲーム業界は、いろいろな課題や問題に直面しながらも巨大化し、今日の時点でのスマートフォン向けゲームの市場へと継承されていきます。 モバイルゲームの歴史 2001 Javaアプリと3Dゲームの登場 Javaが利用できるようになったことにより、ダウンロード型のゲームが供給できるようになりました。 2002 携帯電話端末の大容量化・3D化競争 Java搭載携帯電話端末が登場してからごく僅か1年の間に、アプリのサイズに関しては10倍に広大化し、表現方法も2Dから3Dにシフトし始めました。J-PHONEは『ゼビウス』や『スペースハリアー』などといった昔のアーケードゲームを、ドコモはSIMCITYなどパソコンで世界的規模のヒットを飛ばしたゲームを主力商品としていました。 2003 モバイルゲームの一般化 メモリの制限が厳しいJava仮想マシン上ではなく、OS
以前、紹介したゲームパッドAPIのサンプルを作ってみました。 FirefoxのNightlyビルドとChromeのCanary版でゲームパッドAPIを提供開始 - 強火で進め http://d.hatena.ne.jp/nakamura001/20111220/1324389164 ※Firefoxの実装はW3Cのドラフトとはちょっと異なる部分も有るみたいなのでベンダープレフィックスの Moz を変更したとしたとしても他の環境では動作しない可能性も有るのでその点ご注意下さい。 ゲームパッドを接続した時には以下のイベントが発生します。既に接続済みの状態で実行するとゲームパッドのボタンなどを押した時などに発生します。 window.addEventListener("MozGamepadConnected", function(e) { }, false);こんな感じで情報を取得できます。 w
Firefox Nightly と Chrome Dev に GamePad API が実装されているようです。 API: http://dvcs.w3.org/hg/webevents/raw-file/default/gamepad.html DEMO: http://rawkes.com/blog/2011/12/14/gamepad-api-demo-in-firefox-and-chrome if (navigator.gamepads) { window.addEventListener("gamepadconnected", connected, false); window.addEventListener("gamepaddisconnected", disconnected, false); // 仕様と実装が安定するまで Firefox では // "MozGamep
A quick port of Minecraft4k to test what's possible in JS and HTML5. Because of the nature of this project (it was originally meant as an entry for the Java4k competition, which focuses on executable size), the code is HORRIBLE, but fairly small. You may use the code in here for any purpose in any way you want, at your own risk. var ctx; var pixels; var w = 200; var h = 200; var map = new Array(64
flashと同じく、unityをhtml(サイト)に埋め込むにはjavascriptを使う必要があります。もしかしたらhtmlのembedタグでできるかもしれませんが、枠ができたり一旦クリックしなくてはいけなかったりする可能性がありますし、結局たいしてコードが短いわけでもないのでjavascriptがよいかと思います。 javascriptをhead内に埋め込む 共通で使う以下のタグをjavascriptをheadタグ内に埋め込みます。 <script type="text/javascript" src="http://webplayer.unity3d.com/download_webplayer-3.x/3.0/uo/UnityObject.js"></script> 単独の記事向けにjavascriptを埋め込む サイト内にunityのオブジェクトが1つしかない場合はheadタグ内
モバイルゲーム 物凄い勢いで勃興したモバイルゲーム業界は、いろいろな課題や問題に直面しながらも巨大化し、今日の時点でのスマートフォン向けゲームの市場へと継承されていきます。 モバイルゲームの歴史 2001 Javaアプリと3Dゲームの登場 Javaが利用できるようになったことにより、ダウンロード型のゲームが供給できるようになりました。 2002 携帯電話端末の大容量化・3D化競争 Java搭載携帯電話端末が登場してからごく僅か1年の間に、アプリのサイズに関しては10倍に広大化し、表現方法も2Dから3Dにシフトし始めました。J-PHONEは『ゼビウス』や『スペースハリアー』などといった昔のアーケードゲームを、ドコモはSIMCITYなどパソコンで世界的規模のヒットを飛ばしたゲームを主力商品としていました。 2003 モバイルゲームの一般化 メモリの制限が厳しいJava仮想マシン上ではなく、OS
このページはenchant.jsの用例/サンプルを扱っています。ここではenchant.js ver 0.4.3を使用しています。 *勉強用に作成したページなので間違いや勘違いがあるかもしれません。これはまずい/間違っているというサンプルがありましたらopenspc@alpha.ocn.ne.jpまでメールをください。 ちなみにHTML5 (Canvas)を使ったゲームのプログラムについて解説付きで読んでみたい人は拙著「10日でおぼえるHTML5入門教室」の10章およびダウンロードファイル内の補習講義にて以下のゲームプログラムの解説と実際のコードが入っていますので参考にしてみてください。 ※収録されているもの スカッシュ、ブロック崩し、侵略イカゲーム(インベーダーゲームのようなもの)、集金ゲーム(パックマンのようなドットイートタイプ)、レーダー表示タイプのゲーム(ラリーXやボスコニアンのよ
IDEA*IDEAさんで enchant.js に付属しているRPGのサンプルについて解説されています。丁寧に画像入りで解説されており、お勧めです。 enchant.jsのサンプルコードを解読する(RPG編その1) | IDEA*IDEA http://www.ideaxidea.com/archives/2011/04/enchant_rgb_undocumented.html enchant.jsのサンプルコードを解読する(RPG編その2) | IDEA*IDEA http://www.ideaxidea.com/archives/2011/04/rpg_2.html enchant.jsのサンプルコードを解読する(RPG編その3) | IDEA*IDEA http://www.ideaxidea.com/archives/2011/04/rpg_3.html enchant.jsのサ
モバイルゲーム 物凄い勢いで勃興したモバイルゲーム業界は、いろいろな課題や問題に直面しながらも巨大化し、今日の時点でのスマートフォン向けゲームの市場へと継承されていきます。 モバイルゲームの歴史 2001 Javaアプリと3Dゲームの登場 Javaが利用できるようになったことにより、ダウンロード型のゲームが供給できるようになりました。 2002 携帯電話端末の大容量化・3D化競争 Java搭載携帯電話端末が登場してからごく僅か1年の間に、アプリのサイズに関しては10倍に広大化し、表現方法も2Dから3Dにシフトし始めました。J-PHONEは『ゼビウス』や『スペースハリアー』などといった昔のアーケードゲームを、ドコモはSIMCITYなどパソコンで世界的規模のヒットを飛ばしたゲームを主力商品としていました。 2003 モバイルゲームの一般化 メモリの制限が厳しいJava仮想マシン上ではなく、OS
[読了時間:1分] 先日、リリース間近とお伝えしたHTML5ゲームエンジン「IMPACT」が12月21日未明、正式に公開となった。同エンジンで開発されたゲームは、iOS上では60フレーム/秒を実現するとされており、HTML5対応のウェブブラウザであればプラグインなどをインストールする必要なく実行できるという特徴を持つ。サイトには、効率の良い開発スタイルを説明するビデオやサンプルソースコードなどが公開されている。ライセンスは価格は99ドル。 エンジンを開発した独Dominic Szablewski氏は、HTML5に対応したモダンブラウザ上で高速に動作するゲーム「Biolab Disaster」を公開、その開発のために使用したエンジンを一般に提供すると告知していた。今回の正式リリースで、このゲームもアップグレード。公言通り、iOS上でも快適に動作するようになっている。 lMPACTは、HTML
Hey there, it looks like you're using Microsoft's Internet Explorer. Microsoft hates the Web and doesn't support HTML5 :( To play this game you need a good Browser, like Opera, Chrome, Firefox or Safari. Jump: X, Shoot: C, Move: Arrow Keys So what's the deal? The game you (hopefully) see above is not done in Flash. It's pure HTML5 and Javascript. You don't need any Plugin to play, just a good Brow
説明 BGMを繰り返し演奏するにはSound.load()で演奏するサウンドファイルを読み込ませます。その後、Event.ENTER_FRAMEイベントが発生したらplay()メソッドを使って読み込まれたサウンドを演奏します。Event.ENTER_FRAMEイベントが何度発生しても、サウンドが再生されている場合には、最初に戻って再生されることはありません。サウンドの再生が停止した場合に、再度サウンドが最初から再生されます。これにより、BGMがエンドレスで繰り返し再生されることになります。(BGMサウンド:©西尾将人) サンプル サンプルを実行|データをダウンロード ■HTML <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>Sample game</title> <style> body { margin: 0; }
enchant.js is … カンタンにゲームやアプリを開発できる HTML5 + JavaScript フレームワークです。 2011年に公開され、すでに 1,000 本以上のゲーム/アプリが公開されています。 オープンソース (MITライセンス) で、無料で利用できます。 ドキュメント・書籍・チュートリアルサイトが充実しています。 たくさんのプラグインで機能を拡張できます。 UEI/ARC を中心としたメンバによって開発・メンテナンスされています。 プログラミング教育のためにも利用されています。 Features オブジェクト指向: 表示されているものはすべてオブジェクトです。 マルチプラットフォーム: iOS, Android, Mac, Windows のブラウザで動作します。 Windows 8: Windows 8 対応のHTML5アプリケーションを開発できます イベント駆動
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く