昔なつかしのコナミコマンドを埋め込めるjQueryプラグイン「egg.js」

むかし、ファミコンと呼ばれるゲーム機がありました。
そこでは上上下下右左右左BAとコントローラーを押すと、何かが・・・!
っていうコナミコマンドな隠しコマンドるものがありました。
WEBでもこれを実現するため、jQueryプラグインの「egg.js」を使ってみましょう。
昔なつかしのコナミコマンドを埋め込めるjQueryプラグイン「egg.js」サンプル

使用方法 mikeflynn/egg.js ? GitHubからファイルをダウンロード。
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
<script type="text/javascript" src="egg.min.js"></script>
<script type="text/javascript">
var egg = new Egg();
egg.addCode("up,up,down,down,left,right,left,right,b,a", function() {
jQuery('#id名').fadeIn(500, function() {
window.setTimeout(function() { jQuery('#id名').hide(); }, 5000);
});
}, "konami-code");
egg.addHook(function(){
console.log("Hook called for: " + this.activeEgg.keys);
console.log(this.activeEgg.metadata);
});
egg.listen();
</script>

このようにjsを記述したら、コマンドが押された時に表示させたい要素に#id名を付与します。
<img src="画像パス" id="id名">
なお、最初に要素は隠しておかないといけないので、CSSで記述します。
#id名 {display: none; }
なんとなくわかると思いますが、下記でコマンドを指定できます。
egg.addCode("up,up,down,down,left,right,left,right,b,a", function() {
昔なつかしのコナミコマンドを埋め込めるjQueryプラグイン「egg.js」サンプル

sponsors

「昔なつかしのコナミコマンドを埋め込めるjQueryプラグイン「egg.js」」をシェアする

記事作成:
記事URL:

TOP > > > 昔なつかしのコナミコマンドを埋め込めるjQueryプラグイン「egg.js」