タグ

関連タグで絞り込む (196)

タグの絞り込みを解除

JavaScriptに関するdecoy2004のブックマーク (226)

  • 200行で作る、enchant.jsを使った簡単ぷよぷよプログラミング - あのねノート。

    2013-08-24 200行で作る、enchant.jsを使った簡単ぷよぷよプログラミング やり方 はじめに この前enchant.jsでぷよぷよ by おっ立ち野郎を作って公開しました。 enchant.jsで作ったHTML5+JavaScriptな「ぷよぷよ」を公開しました これを知り合いR君に紹介したところ、嬉しい事に「僕もぷよぷよ作りたい!」といってもらえました。それでぷよぷよの解説サイトをネットで見つけて紹介しようと思いました。 しかし、テトリスの解説サイトは山ほどあるのに、ぷよぷよプログラミングの解説サイトが全然ありませんでした。特に完成まで解説しているサイトは見つけられませんでした。テトリスはあるのに。 ということで、今回ぷよぷよプログラミングの完成までの解説を書いてみました。これはenchant.jsの基礎をひと通り勉強された方におすすめです。クマをちょこちょこ動かすだけ

  • JavaScriptでアニメーションを書く初歩の初歩

    JavaScriptを使ってアニメーションを書くときに有用なテクニックの、基中の基をご紹介します。おそらく、このブログを見ている人のほとんどにとっては釈迦に説法だと思います。今回、requestAnimationFrameの話すらしません。その点、ご留意ください。 まず、JavaScriptでアニメーションをする場合に気をつけないといけないのが、一度JavaScriptの実行(Context)を抜けないとブラウザに描画が反映されないということです。簡単に言うと、 <html><head><title>bad sample</title><script> onload = function() { var e = document.getElementById("e"); for(var i = 0; i <= 100; i += 5) { e.style.left = e.style.

  • Google ChromeのJavaScriptデバッガの進化がすごい - os0x.blog

    Chrome版のFirebugことGoogle Chrome Developer Toolsですが、以前gihyoで解説したときよりさらに便利になっているので、少し紹介します(元はWebKitなので、そのうち(近いうちに)Safariでもそれなりに使えるようになるはずです)。 圧縮されたコードの整形 まず、目立つところからいきましょう。ちょうど先日更新されたChromeのdev版(12.0.742.0)に搭載されたばかりの機能で、minifyされているJavaScriptコードを読みやすいように整形して表示してくれるというものです(IE9の開発者ツールにも実装されている機能です)。 例えば、Google Analyticsのコードは圧縮されていて普通は読めません。 しかし、Chromeのデベロッパーツールなら、 このように整形してくれます。 やり方は簡単で、デベロッパーツールのScript

    Google ChromeのJavaScriptデバッガの進化がすごい - os0x.blog
    decoy2004
    decoy2004 2011/04/24
    圧縮されたコードの整形。Scriptパネルのコードエリアでダブルクリックすると編集モードに入り、自由にコードを書き換えることができます。条件付きブレークポイント
  • ページに仕込まれたJavaScriptのイベントを全部見える化出来るブックマークレット「Visual Event」:phpspot開発日誌

    画像スライダーに関することならお任せ!なjQueryプラグイン「Slider Kit... 次の記事 ≫:かなりいい感じのWordPressテーマ20 Allan Jardine | Reflections | Visual Event ページに仕込まれたJavaScriptのイベントを全部見える化出来るブックマークレット「Visual Event」。 JavaScript で開発していて、jQuery等の各種フレームワークや、on〜 を使ってイベントを埋め込むことは多いですね。 後になって、どこにイベントがあるのかをすぐ見える化し、どのような処理が記述されているのか、確認することのできるブックマークのご紹介です。 当サイトにはそれほどイベントが組み込まれていませんので、Yahoo! Japanのトップページで試してみます。 ブックマークレットを起動すると、グレーアウトされ、エレメントの上

    decoy2004
    decoy2004 2011/04/17
    ブックマークレットを起動すると、グレーアウトされ、エレメントの上にイベントが設定されていることを分かりやすく示してくれます。
  • JavaScriptで書かれたWeb統合開発ツール「Orion」発表。Eclipseの新プロジェクトとして

    EclipseはオープンソースによるJavaベースの統合開発環境として知られていますが、そのEclipseで新プロジェクト「Orion」が発表されました。 Orion is not a set of Java plug-ins which run in the existing Java IDE. It is browser-based open tool integration platform which is entirely focused on developing for the web, in the web. Tools are written in JavaScript and run in the browser. Orionは、既存のJava IDEに対応したJavaプラグインのセットではありません。ブラウザベースのオープンなツールの統合プラットフォームであり、Web

    JavaScriptで書かれたWeb統合開発ツール「Orion」発表。Eclipseの新プロジェクトとして
    decoy2004
    decoy2004 2011/02/06
    Orionが目指しているのは、Webブラウザ上でWeb開発に必要なあらゆる機能を実現すること。
  • javascriptの関数が変態すぎる

    はじめての海外旅行!3週間行って帰ってきた全体の感想編! はじめに 5/19-6/6 の約3週間でポーランド・イギリス・ドイツを訪れる海外旅行に行きました。 このブログは、この期間を通して何を感じたとかそういいう内容のブログです。 それぞれの地域で何をしたかとかのブログは半分くらい書けていないんですが、写真を見返しなが…

    javascriptの関数が変態すぎる
    decoy2004
    decoy2004 2011/02/03
    静的メソッドはインスタンス化したオブジェクトでは使えない
  • ゆーすけべー日記

    decoy2004
    decoy2004 2011/01/17
    インタラクションのほとんどはjQuery MobileのAPIを通してイベントを取得しています。
  • 問題解決の手引 - Mashpad.jp

    decoy2004
    decoy2004 2011/01/13
    MashPadの内部では、Googleガジェットをエミュレーションしているので、既存のGoogleガジェットをそのままMashPadで使うこともできます。もちろんその逆も可能です。
  • 昨日騒ぎになったTwitterのXSS脆弱性によって実際に受けそうな被害とその対策 - monjudoh’s diary

    何が出来るのか どんな脆弱性かの詳細はこちらを参照2010 年 9 月 21 日現在のツイッターのバグ(脆弱性)について 外部JavaScriptを読み込むコードを仕込めたので、 どんなJavaScriptでも実行できる状態でした。 以下、JavaScriptの実行によってTwitter上で出来る事。 セッションハイジャック JavaScriptからcookieを参照できるのでログイン状態のセッションIDも参照できます。 また、任意のJavaScriptが実行できる以上、参照したセッションIDを攻撃者のサーバ等に送信することも出来ます。 攻撃者は奪ったセッションIDをcookieに設定すれば、被害者のアカウントでtweet,direct messageの閲覧・送信が出来ます。 確認してみたところ、ログイン状態のセッションIDはログアウトしても無効にはなりません。 設定→パスワードからパスワ

    昨日騒ぎになったTwitterのXSS脆弱性によって実際に受けそうな被害とその対策 - monjudoh’s diary
    decoy2004
    decoy2004 2010/09/23
    セッションハイジャックされてたらログアウトしても無駄なので、
  • 2010 年 9 月 21 日現在のツイッターのバグ(脆弱性)について

    【お知らせ】 9 月 21 日午後 11 時頃、公式サイドから脆弱性が修正されたとの発表がありました。 はじめに 2010 年 9 月 21 日、ツイッターで深刻な脆弱性(ぜいじゃくせい)が発見され、被害が広がっています。これが何なのか、簡単に説明します。 JavaScript とマウスオーバーイベント まず、下のピンク色の枠内にマウスカーソルをすべらせてみてください。 この枠の中をマウスカーソルで触って! どうでしたか。「触ってくれてありがとう!」というメッセージが表示されましたね。 このように、ウェブページには簡単なプログラムを仕込むことができます。どのウェブブラウザー(皆さんがウェブを見る時に使うソフトウェア。インターネットエクスプローラーなど)でも共通で使える「JavaScript (ジャバスクリプト)」という言語が一般的に使われています。 今回は、ページ上のある部分にマウスカーソ

    decoy2004
    decoy2004 2010/09/22
    ツイッターのバグ(不具合)を利用して JavaScript を仕込む方法が発見されたようです。公表されました
  • JavaScriptでiPhoneアプリを楽々作成

    iPhoneアプリを作るためには以下のようなプログラミングの知識が必要だと思われています。 Objective-Cの知識 (Cの知識 + オブジェクト指向プログラミングの知識) iPhoneのライブラリの知識 これらをマスターするのはかなり大変ですが、 「PhoneGap」というシステムを利用すると、 JavaScriptだけを使って簡単にアプリを作成することができます。 iPhoneのSafariから JavaScriptが動くWebページにアクセスするとiPhone上でJavaScriptプログラムを動かすことができます。 このような「Webアプリケーション」はSafariの上でしか動作しませんし、 ネットに接続されていない状態では利用できません。 しかしPhoneGapを利用すると、 JavaScriptプログラムとSafariをまとめてひとつのアプリケーションを生成することができる

    decoy2004
    decoy2004 2010/08/15
    JavaScriptプログラムとSafariをまとめてひとつのアプリケーションを生成することができるので、 ネットが接続されていない環境で動作するiPhoneアプリケーションを JavaScriptだけで 作成することができます。
  • jsdo.it

    Come creare il miglior gioco da casinò Quando si progetta un gioco da casinò, la prima cosa che devi considerare è che tipo di gioco sarà. Ci sono molti diversi tipi di giochi da casinò, dalle slot e video poker ai giochi da tavolo e giochi di carte. Dovrai decidere quale tipo di gioco si adatta meglio alle tue esigenze. Ogni tipo di gioco ha il proprio set di regole e regolamenti, quindi dovrai a

    decoy2004
    decoy2004 2010/08/09
    ブラウザ上でJavaScript, HTML5, CSSを書き、共有するサービスです。
  • http://www.designwalker.com/2010/07/chart-tool.html

    http://www.designwalker.com/2010/07/chart-tool.html
    decoy2004
    decoy2004 2010/07/18
    Googleから公開されているチャートツールは、画像チャートとJavaScriptを使って生成するインタラクティブチャートの2種類があります。
  • 第3回 JSONPでのクロスドメインアクセス | gihyo.jp

    JSONPの動作原理 前回はAjaxに存在するセキュリティモデルであるSame-Originポリシーを紹介し、そのSame-Originポリシーを迂回する方法とセキュリティについて見てきました。また、回避する方法の1つめとしてリバースProxyを用いた方法を紹介しました。リバースProxyを用いた方法ではセキュリティ的な問題点もありましたが、そもそもProxyサーバを用意しなければならないため、この方法は手軽に使うことはできませんでした。 そこで考え出されたのがJSONP(JavaScript Object Notation with Padding)という方法です。 それではまず簡単にJSONPについて説明します。 Ajaxで使われるXMLHttpRequestオブジェクトには前回説明したとおりSame-Originポリシーがありクロスドメインアクセスはできません。一方、SCRIPTタグ

    第3回 JSONPでのクロスドメインアクセス | gihyo.jp
    decoy2004
    decoy2004 2010/05/22
    SCRIPTタグにはSame-Originポリシーがありませんので,異なるドメインのサーバにJSONPデータを置くこともできます。
  • [鏡] 入門 JSON 3 -- JSONP とコールバック関数 -- 戯れ言

    最近 JSONP というのが話題になっているようですので, ここで簡単に紹介します。 JSONP (JSON with Padding)というのは JSON のデータフォーマットにちょっとした記述を加えて JavaScript の関数として呼び出せるようにしたものです。 JSONP については以下の記事に簡単な説明があります。(多分この記事が初出だろうという話です) Remote JSON - JSONP 例えば以下のような JSON データがあるとします。 { "name" : "Yasuhiro ARAKAWA" } JSONP ではこのデータに記述を加えて JavaScript 関数のようにしたものです。 分かりにくいですね。 具体的にはこのように記述します。 callback( { "name" : "Yasuhiro ARAKAWA" } ); "callback" の部分は関数

    [鏡] 入門 JSON 3 -- JSONP とコールバック関数 -- 戯れ言
    decoy2004
    decoy2004 2010/05/22
    JSON フォーマットが RFC4627 として正式な仕様になりました。 メディアタイプも application/json と決まりました。
  • snippets from shinichitomita’s journal - ブラウザからJSONで呼び出せるサービス一覧

    ブラウザから動的スクリプトタグで呼び出せるJSONサービスの一覧。サービス利用にはHTMLJavaScriptさえあればよいもののみ挙げている。JSONPであるとは限らない。オフィシャル/非オフィシャル問わず。知らないのがあったら誰か教えてください。 (追記)JSONP形式のサービスにはJSONPテストページへのリンクを追加しました del.icio.us ポスト一覧取得 http://del.icio.us/feeds/json/stomita (既定変数埋め込み) http://del.icio.us/feeds/json/stomita?callback=handlePosts (JSONP) →テスト タグ一覧取得 http://del.icio.us/feeds/json/tags/stomita (既定変数埋め込み) http://del.icio.us/feeds/json

    snippets from shinichitomita’s journal - ブラウザからJSONで呼び出せるサービス一覧
  • [気になる]JSONPの守り方

    JSONP提供側のXSS JSONPを提供する側は、コールバック関数の名前を自由に指定できるようにしているのが一般的です。 例えば、「http://example.jp/weather.json?loc=tokyo&callback=ShowWeatherInfo」のように指定してやり、コールバック関数名としてShowWeatherInfoを使うなどです。 このコールバック関数の名前の部分も、攻撃者によるクロスサイトスクリプティングに利用される可能性がありますので、JSONPを提供する側では、コールバック関数の名前として使える文字を制限してやる必要があります。 例えば、「http://example.jp/weather.json?loc=tokyo&callback=%3Cscript%3Ealert(1)%3C%2Fscript%3E」のようなURLでJSONPが要求されたときに、ca

    [気になる]JSONPの守り方
    decoy2004
    decoy2004 2010/05/22
    コールバック関数の名前の部分も、攻撃者によるクロスサイトスクリプティングに利用される可能性があります
  • [気になる]JSONPの守り方

    XSSにCSRFにSQLインジェクションにディレクトリトラバーサル……Webアプリケーションのプログラマが知っておくべき脆弱性はいっぱいあります。そこで連載では、そのようなメジャーなもの“以外”も掘り下げていきます (編集部) JSONPだって、セキュリティを気にしてほしい 皆さんこんにちは、はせがわようすけです。今回は、JSONPを使用する場合のセキュリティについて解説しましょう。 JSONPとは、JSON with Paddingの名称が示しているとおり、JSON形式のデータにコールバック関数の呼び出しのためのコードを付加することで、クロスドメインでデータの受け渡しを実現するためのデータ形式です。JavaScriptからクロスドメインでのデータが簡単に扱えることなどを理由に、多数のWebアプリケーションでAPIの一部としてJSONP形式でデータの提供が行われています。 具体的な例を見

    [気になる]JSONPの守り方
    decoy2004
    decoy2004 2010/05/22
    攻撃者の用意した悪意あるサイトであっても、正規のサイトと同様にJSONデータが引き渡されます。
  • MacRuby: The Definitive Guide

    Build the skills your teams need Give your teams the O’Reilly learning platform and equip them with the resources that drive business outcomes. Click on a feature below to explore. Trusted content Live online events Courses Interactive learning Certification prep O’Reilly Answers AI Academy Assignments Insights Dashboard Trusted content you can count on More than 60K titles from O’Reilly and nearl

    MacRuby: The Definitive Guide
    decoy2004
    decoy2004 2010/03/11
    Stark 本は、HTML、CSS、JavaScript というオープンソースの Web 技術の知識さえあれば、iPhone のネイティブアプリ作成が可能という立場にたって、そのやり方を解説している。O’Reilly のサイトで全文を読むことができる。
  • Jonathan Stark 著「HTML、CSS、JavaScript を使って iPhone アプリを作る」

    Jonathan Stark 著「HTMLCSSJavaScript を使って iPhone アプリを作る」 2010年3月11日 投稿者: shiro [Jonathan Stark の] 去年から待ちかねていた Jonathan Stark のがやっと届いた。 先に紹介した「HTMLCSSJavaScript を使って iPhone アプリを作る」の作者が書いただ。 最初に知ったときはショックだった。 Objective-C や Cocoa を使わないで、 HTMLJavaScript だけで iPhone のネイティブアプリが出来るというのだ。もしそうなら、スタンフォード大の入門講座で四苦八苦したのはナニ? Stark は、HTMLCSSJavaScript というオープンソースの Web 技術の知識さえあれば、iPhone のネイティブアプリ作成が可能

    Jonathan Stark 著「HTML、CSS、JavaScript を使って iPhone アプリを作る」
    decoy2004
    decoy2004 2010/03/11
    Stark 本は、HTML、CSS、JavaScript というオープンソースの Web 技術の知識さえあれば、iPhone のネイティブアプリ作成が可能という立場にたって、そのやり方を解説している。O’Reilly のサイトで全文を読むことができる。