JavaScriptでテトリスっぽいもの#1 - 生涯未熟
今回はJavaScriptでテトリスっぽいものを作ってみたいと思います。 参考にさせて頂いたサイトはこちらです。 JavaScript でテトリスみたいなゲームを作ろう！ しかし、こちらでは解説が少ないので説明も付け加えつつ作成していきます。 あと、説明は2.JavaScriptとはから始めさせていただきます。 ・JavaScriptとは まずはJavaScriptの簡単な使い方から。 サンプルプログラムは以下です。 <!DOCTYPE html> <html> <head> <meta charset=utf-8> <title>Sample</title> <script type="text/javascript"> alert("Hello, world!"); </script> </head> <body> <p>Hello, world!</p> </body> </html
jQuery 公式 Blog 「jquery-latest.js を使用するのをやめろ」
jQuery 公式 Blog は、「Don't Use jquery-latest.js」 と題された記事内で、今後、jquery-latest.js のバージョンを 1.11.1 で固定することと、本番環境で jquery-latest.js を読み込むのをやめてくれというアナウンスを行っています。 jQuery 公式 Blog は、7月 3日付けで投稿された 「Don't Use jquery-latest.js （jquery-latest.js を使うな）」 と題された記事内で、今後、jquery-latest.js のバージョンを 1.11.1 で固定することと、本番環境 （公開している Web サイト） で jquery-latest.js を読み込むのをやめてくれというアナウンスを行っています。 Don't Use jquery-latest.js ： Official jQ
tmlib.js 怒濤の 100 サンプル!! – Graphics(HTML5 Canvas) 編 | TM Life
tmlib.js のハッカソンイベントをやることになりました!! っということでそれまでにバンバン tmlib.js のエントリーを投稿していこうと思います. 今回はその第一弾! Graphics(HTML5 Canvas) 編です. このサイトでお馴染みの怒濤シリーズ. tmlib.js の Graphics 周りの機能についてのサンプルを作りまくってみました. 怒濤って何？って方はこちらをどうぞ enchant.js 怒涛の 100 tips CoffeeScript 入門! 怒濤の 100 サンプル!! tmlib.js で定義されている tm.graphics.Canvas クラスは HTML5 Canvas を拡張したものなので HTML5 Canvas の機能は基本的にそのまま使えます. なので HTML5 Canvas の勉強にもなるかと思います. また, それに加え星型や多
piyo-js.com - このウェブサイトは販売用です！ - 初心者 入門 リファレンス リソースおよび情報
This webpage was generated by the domain owner using Sedo Domain Parking. Disclaimer: Sedo maintains no relationship with third party advertisers. Reference to any specific service or trade mark is not controlled by Sedo nor does it constitute or imply its association, endorsement or recommendation.
ソースコードの装飾表示方法 SyntaxHighlighter
HTML,CSS,JS,Perl,PHPなどの各ソースコードをWebサイト上に綺麗に再現。 NetyaSun ソースコード表示 ホームページ 作成、運営、管理ガイド 行番号や各行背景色で見やすい ソースコード ビュー ライブラリ SyntaxHighlighter エディタのようにWebサイト上に綺麗にソースコードを表示する方法。 ソースを書くプロ達や未来の開発者のための学びの場である HTML,CSS,JS,Perl,PHPなどのマニュアル・解説サイトなどで、 PREソースコードを行頭番号付きでカッコよく表示するソース ビューア SyntaxHighlighter SyntaxHighlighter:Download ソース上にオンマウスで の操作タブがソースの右上に表示されるようになった。 ソースを別窓ビュー表示したりクリップボードに保存や印刷も可能な優れものです。 <?xml ve
50行で作る、HTML5+JavaScriptな簡単ライフゲーム【プログラミング】 - あのねノート。
2013-09-14 50行で作る、HTML5+JavaScriptな簡単ライフゲーム【プログラミング】 やり方 はじめに。 ライフゲームを知っていますか？ライフゲームは世界でとっても有名なシュミレーションゲームです。Wikipediaによると、 1970年にイギリスの数学者ジョン・ホートン・コンウェイ (John Horton Conway) が考案した生命の誕生、進化、淘汰などのプロセスを簡易的なモデルで再現したシミュレーションゲームである。 らしいです。 眺めているだけでもさまざまなパターンを観測することができてとても興味深く、魅力的なゲームです。 見つけだすのに賞金も賭けられたという「グライダー銃」というパターンは特に有名ですね。 もっとライフゲームについて詳しく復習したい方は秀逸なWikipediaのページを見ることを薦めます。 ライフゲーム - Wikipedia また、ライフ
Processing.js基礎最速入門 - catch.jp-wiki
関連：p5.js、日本語っぽいプログラミング言語そら豆スクリプト、HTML5+JavaScript Processing.jsは、ビジュアルデザイン用プログラミング言語の先輩格である「Processing」をベースに、最新のWeb環境(HTML5のCanvas要素、Javascriptあたり)で手軽に使えるようにしたものです。 この記事は、そんなProcessing.jsの簡単な入門記事です。先に書いたProcessing基礎最速入門の姉妹編になります。 本記事の対象読者は、基本的にまるでプログラミング体験のない人。でもまあ、Webデザインとか少しでも知っているほうが、取り組みやすいかも知れません。自分でいろいろ調べたり探究するのが好きなほうが良いでしょう。 2011-06-06:Processing-1.2.1.js で動作確認しています。 ●なんと、日本語っぽいコードをProcessi
Processing.jsによるHTML5 Canvasグラフィック(1/5):JavaScript/Ajaxライブラリ入門 - libro
Processing.jsは、HTML5に用意されている<Canvas>タグを利用したグラフィックの描画を行うためのライブラリです。作っているのは、jQueryの作者でもあるJohn Resigさんです。 HTML5の機能というと、「まだ普通のブラウザじゃ使えないのでは？」と思うかも知れません。が、それは違います。HTML5の機能は、部分的にですが既に多くのブラウザで実装されつつあります。特に、グラフィックを利用するための<Canvas>タグは、Firefox、Chrome、Safariといった主なブラウザの最新版で既に実装済みなのです。――え、IE？ だから、「主なブラウザでは」ですってば。マイナーなブラウザでは、まだ未対応なんですよ。そのへんは理解してくださいね。 さて、このライブラリは以下のサイトにて配布されています。 http://processingjs.org/ このサイトから
Modernizr を使ってブラウザの機能にあわせた CSS, JS を書く ｜ Tips Note by TAM
今回は、HTML5, CSS3 を使ってウェブサイトをつくる際の助けになる JavaScript ライブラリ Modernizr をご紹介します。 HTML5, CSS3 では便利な機能が多数追加されましたが、ブラウザによって対応状況はまちまちです。 Modernizr を使うとブラウザの HTML5, CSS3 対応状況を簡単に調べることができるので、個々の状況にあわせたコードを比較的容易に書けるようになります。 バージョンの古い Internet Explorer 等に対応する際、コンディショナルコメントやいわゆる CSS セレクターハックを使用することがありますが、それらと同様のものと考えると分かりやすいかもしれません。 それではごくごく簡単ではありますが、以下に基本的な使い方をご紹介します。（バージョン等は記事執筆時点のものです。変更になっている場合があります。） 1. moder
【第22回 HTML5とか勉強会レポート】 Processing.js、SVG、WebGL。HTML5周辺のグラフィック関連技術
HTML5による最新Webアプリ 2011年10月26日、品川グランドセントラルタワーのマイクロソフト品川本社にて、「第22回 HTML5とか勉強会」が開催された。HTML5とか勉強会は、HTML5に関心のあるエンジニアやコーダー、デザイナー向けの勉強会だ。今回のテーマは「グラフィック関連API」。当日の様子をお伝えしよう。 Processing.jsってなんだ？ まず、ゼロベースの田中氏（@dotimpact）からプレゼンがスタートした。田中氏は美術大学で非常勤講師をしたり、Processingの入門書執筆なども手掛けている。 Processingとは 田中氏のプレゼンは、Processingの紹介から始まった。 田中氏の＠ITでのProcessingの記事「Processingの対話式スケッチプログラミングで遊ぼう」も参照いただきたい。 Processingは2001年、MITメディア
JavaScript: window.open() 小窓の基礎
window.open()で小窓 いわゆる小窓です。これはJavaScriptの window.open() というメソッドで 小窓となるウィンドウを生成します。 各引数の文字列は一重引用符または二重引用符で括って指定します。 第１引数「URL」は生成されるウィンドウに表示するページのURLです。 ※ ウィンドウに表示するページ（別のファイル）は別途作成して用意しておきます。 第２引数「ウィンドウ名」は特に指定する必要がなければ null で良いでしょう。 ウィンドウ名を指定するときは引用符で括ります。 ※ null を指定するとウィンドウ名の設定されていない新規ウィンドウとなります。 (HTMLの属性 target="_blank" と同等です) 例: window.open('example.html', null); 第３引数「オプション」はウィンドウの特徴を設定する文字列です。 こ
HTML5でシンセサイザー効果音が作れるJSライブラリ「jsfx」
JavaScriptでチップチューン風サウンドエフェクトを生成するライブラリ : jsfx (音楽方丈記) HTML5 audioで作られた、パラメータを指定するだけでシンセサイザー効果音が作れるJavaScriptライブラリ「jsfx」が紹介されています。 ライセンスはMITのようです。
Web 製作者必携？iPhone からソースが確認できる「ScriptBrowser」 | バシャログ。
ペルー代表との試合を見ましたが、今のところ 3-4-3 はイマイチ機能してないですね。だんだんモノになっていくのか？ kimoto です。 この前、iPhone の Web ブラウザいろいろということでまとめの記事を書きましたが、今回もブラウザのご紹介をしようと思います。 html や js、css などを見ることのできる「ScriptBrowser」です。 まず普通にサイトを表示させたあと、「Source」をタップ。するとハイライトされた html のソースコードが表示されます。 「折り返されてないのが見づらいよ！」というあなたは右下のアイコンをタップすればちゃんと右端で折り返してくれます。 「いかんせん横が狭すぎだろ…」というあなたも、横画面にすればその悩みが解決します。さらにピンチアウト、ピンチインで拡大縮小もできます。 「html しか確認できないの？」js や css もちゃんと
impress.jsでド派手なスライドをつくろうぜ！
“HTML5アプリ作ろうぜ！”連載がスタートしました！ デジタルハリウッドの現役アプリクリクリエイター専攻講師が、最近はやりの「HTML5・JavaScriptライブラリ・CSS3・API」の紹介、またそれらを組み合わせた「sampleアプリケーションの紹介と解説」を厳選し執筆していきます。 最近、セミナーでこの「impress.js」を利用する機会が多いのですが、その際に参加者から評判が良いので、まずはこれを紹介します。 impress.jsとは？ CSS3を活用したオープンソース（ライセンスMIT）のプレゼンテーションJavaScriptライブラリです。 対象ブラウザ Safariブラウザが現状では最もスムーズに動作します。一応、Chromeも推奨ブラウザです。 特徴 【1】ド派手なスライド動作 最大の特徴は派手でイケイケなスライド。始めてみた人は必ず見入ること間違いありません。シンプ
HTML5演出に最適な複数画像読み込み管理のJSライブラリ「LoadManager.js」 | ClockMaker Blog
HTMLで複数の画像を読み込むとき、HTMLのimgタグだけだと不恰好となりがちですが、読み込みを管理すれば見栄えも整いますというデモとJSライブラリを作ってみました。次の2つのデモを見比べて何が違うのか確認ください。 デモ (通常のimgタグ) デモ (LoadManager.jsを使用) デモの違いとは 前者は画像がバラバラとインターレース的に読み込まれ、後者は読み込み終わるまでローディングが表示され読み込まれたものがフェードインして表示されます。 ▼前者のデモ ▼後者のデモ 後者のデモには、ローディングのパーセンテージ表示も付いています。読み込みが何%まで達しているかを確認できるのも、後述のJSライブラリのメリットです。 HTML5で作られたフルFlash的なサイトを見たときにimgタグでインターレース的に画像がバラバラとでてくることが多くて、いつも微妙な思いをしていました。Flas
うむるむ -[ flash ] AC_RunActiveContent.jsって何さ?- by um
[ flash ] AC_RunActiveContent.jsって何さ? - 09/06/02 15:13 by um 件名の様な質問をたまに受けるが、「AC_RunActiveContent.js はswfをhtmlに埋め込む時に必要な js です。」と返すのがお約束。 （CS4は知らないけど、CS3では）swf の他に html もパブリッシュすると AC_RunActiveContent.js も一緒(htmlと同階層?)に作成される。 html を通して flash を見る時はこいつもアップしないと掲示板でおなじみのこのページでは AC_RunActiveContent.js が必要です。が表示される。 なので、html の head タグ内で AC_RunActiveContent.js をロードしてる場合は AC_RunActiveContent.js を忘れずにアップ
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
[JS]美しい曲線を使ったチャート・グラフが描けるHTML5 Canvasを使ったスクリプト -Flotr2
JS Bin
http://oji21.com/hpt/menu02/internetvideo.html
_level0 | Kayac Interactive Designer's Blog
