はじめまして!クロカワリュートです 180mm という屋号のマークアップエンジニアです でもフリーランスじゃないです 五反田の制作会社に勤めています 現在転活中です
今日の内容 JavaScriptを勉強し始めくらいの人を対象にしたJavaScript入門講座的なもの 文法とかは調べればわかるのでふれません 一人で勉強してもわからなそうな概念などを重点的に説明します ライブコーディングするのでJavaScriptってこんな感じて作るんだなーというのがわかってもらえればと アジェンダ JavaScriptを勉強する前に JavaScriptの基礎知識 ライブコーディング part1 jQueryの基礎知識 ライブコーディング part2
追記 CPANリリースしました http://search.cpan.org/dist/JavaScript-Value-Escape/ /追記 malaさんの「HTMLのscriptタグ内に出力されるJavaScriptのエスケープ処理に起因するXSSがとても多い件について」にちょろっとでているgistのコードをモジュールにしました。 JavaScript::Value::Escape - https://github.com/kazeburo/JavaScript-Value-Escape JavaScript::Value::EscapはHTMLのscriptタグ内にデータを埋め込む際に、少々過剰にエスケープを行うものです。このモジュールではq!”!, q!’!, q!&!, q!>!, q!<!, q!/!, q!\!, qq!\r! と qq!\n! を\u00xxなどに変換しま
The document discusses JavaScript patterns. It begins by introducing the author and their motivation for learning patterns. It then covers essential patterns around scope, literals and constructors, functions, and code reuse. It discusses the single var pattern, constructor functions, private members, and classical versus prototypal inheritance. The document is an educational guide to common JavaS
Flash界のコーディングゴッドGSkinnerがJavaScriptのCanvasをFlashライクに使うライブラリを作った。 この人、確か僕と同い年ぐらいかちょい下なんだよね。。。会う度に超へこむ。 画期的というか、確実にかゆいところに手が届くライブラリで、下みたいなのがサクサクJSでいける。あいかわらずソースは美しいし、ドキュメントも完備。 game sparkles rollover localToGlobal globalToLocal sprite sheets ざっと見た感じFlashでいうところの、Stage, MovieClip, Sprite, Bitmap, Matrix, Stage, EnterFrameとキーフレームアニメがサポートされてる感じ。これは素敵。 このライブラリそのものもスゴいんだけどポイントは、GSkinnerがJSやりだしたってことは、365日以
iOS4.2から実装されたというJavaScriptの加速度センサーAPIを試してみました Tweet 2010/12/16 木曜日 matsui Posted in iPhone | No Comments » 先日リリースされたiOS4.2から実装されたという、Safari上で動作するJavaScriptの加速度センサーAPIを試してみました。 使い方はごく簡単で、次のようにして加速度が取得できます。 event.accelerationIncludingGravity.x; iPhoneを傾けると赤い点がコロコロと移動するというサンプルプログラムを作ってみました。 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <meta http-equiv="Content-Type" c
2010年11月26日18:00 カテゴリTipsLightweight Languages javascript - ブログパーツ/ウィジェット開発者におねがい JavaScript: The Good Parts Douglas Crockford / 水野貴明訳 [原著:JavaScript: The Good Parts] たった二つです。 名前空間を一つだけ用意して、それのみを使うこと 設定はグローバル変数ではなく、引数渡しにすること そうでないと、導入したサイトで変数衝突が起こる公算が大きくなります。 それが実際に発生したのが、右の画像です。表示がぐしゃぐしゃになっています。 問題を起こしたのは、以下のsnippetでした。 <script type="text/javascript" src="http://blogchart.jp/js/blogparts.js"></sc
LT on Firefox Developer Conference 2010 404 Not Found | Mozilla Japan で ECMAScript Harmony の Proxy について LT させて頂きました. 発表資料 発表に使った資料を SlideShare にアップロードしました. 途中, Harmony を Harmoney と書いているところが多々ありますが, やさしく見過ごしてやって下さい. 追記 (2011 2/23 21:01) スライド中,以下のように has (in 演算子に対応) が第一引数に Proxy のインスタンスを受けとるような書き方をしてしまっていますが,これは誤りです. Proxy.create({ has: function (p, name) { } }); Proxy.create({ has: function (_, nam
RequireJSって何? 公式サイト RequireJS スライド jQueryRequireJS.pdf 日本語記事だとこの辺? http://zudolab.net/blog/?p=451 要はJavaScriptの依存性解決をしてくれるライブラリで、こんな感じで使えます。 require( [ 'lib/a' ,'lib/b' ,'lib/c' ], function(){ // lib/a.js,lib/b.js,lib/c.jsが読み込まれていることが保証されているcallback require( [ 'lib/d' // lib/a.jsに依存しているライブラリ ,'lib/f'// lib/b.jsに依存しているライブラリ ], function(){ // lib/a.js,lib/b.js,lib/c.js,lib/d.js,lib/e.jsが読み込まれていることが保
FlashをHTMLに貼るライブラリ swfobject 2 を使う
XMLHTTPRequestまわりはひとまず置いておく。 これどうすんだよっていうのがあったら教えてください。 今のところまったくHTML5は関係ない記事になっている。 メモメモ。 $ $$([CSS Selector]).first() document.querySelector([CSS Selector]) var element = document.querySelector('input[name=id]'); console.log(element.value); $$([CSS Selector]) document.querySelectorAll([CSS Selector]) var elements = document.querySelectorAll('li.userProfile'); console.log(elements); $A Array.prot
はてなグループの終了日を2020年1月31日(金)に決定しました 以下のエントリの通り、今年末を目処にはてなグループを終了予定である旨をお知らせしておりました。 2019年末を目処に、はてなグループの提供を終了する予定です - はてなグループ日記 このたび、正式に終了日を決定いたしましたので、以下の通りご確認ください。 終了日: 2020年1月31日(金) エクスポート希望申請期限:2020年1月31日(金) 終了日以降は、はてなグループの閲覧および投稿は行えません。日記のエクスポートが必要な方は以下の記事にしたがって手続きをしてください。 はてなグループに投稿された日記データのエクスポートについて - はてなグループ日記 ご利用のみなさまにはご迷惑をおかけいたしますが、どうぞよろしくお願いいたします。 2020-06-25 追記 はてなグループ日記のエクスポートデータは2020年2月28
郵便番号から住所補完zip2addrサンプル Google日本語入力APIを利用し、完全にメンテナンスフリーな住所補完機能を提供します。 フロントエンドのJavaScriptのみで作動するため、サーバーサイドに手を加える必要はありません。 数行のJavaScriptを書くだけで簡単に既存のフォームに実装できます。 こちらからどうぞー: https://github.com/kotarok/jQuery.zip2addr jQueryとzip2addrの読み込み 下記のようにjQueryとzip2addrを読み込んでおきます。これで準備は完了。 <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script> <script type="te
先日勉強会で@kotarok先生が見せてくれたjQuery.zip2addrを元に車輪の再々発明(kotarokさんのが再発明と言っていたので)してみました。 jQuery.zip2addrはGoogle日本語入力APIを利用して郵便番号から住所を検索するという画期的アイデアのスクリプトなんですが、これのjQueryとかHTMLに依存してない版です。 DEMO hokaccha’s js-zip2address at master - GitHub zip2address('150-0001', function(address) { address.all; //=> 東京都渋谷区神宮前 address.pref; //=> 東京都 address.city; //=> 渋谷区神宮前 }); ハイフンはあってもなくてもいいです。郵便番号が間違ってたりするとaddressにはundefin
2014年8月22日 CSS, jQuery どんなWebサイトでも設置されているフォーム。なんの装飾もなく味気ないフォームより、デザインされたもののほうが連絡してみたくなるはずです!そんなフォームも少し手を加えるだけで素敵なデザインに変身させることができます。今回はCSS3とjQueryを使ってより美しいフォームを作成する方法を紹介します。 ↑私が10年以上利用している会計ソフト! フォームの仕様 今回チャレンジするフォームの主な仕様です! グラデーション・ボックスシャドウを使って立体感を表現 角丸で丸みをつける(モダンブラウザ) 対応ブラウザ: IE7△, IE8△, IE9, Firefox, Chrome, Safari フォーム制作の流れ CSS3ってなんだ?という人もひとつひとつ記述していけば意外と簡単に作れるはずです!リンクをクリックで各項目にジャンプします。 テキストボック
Welcome to CommonJS, a group with a goal of building up the JavaScript ecosystem for web servers, desktop and command line apps and in the browser. This wiki is a starting point for collecting up ideas, any draft API suggestions for the CommonJS group. Discussions occur on that mailing list and on IRC (#commonjs on freenode). Meta Introduction FAQ Process Target Platforms Coding Standards Current
iPhone特有の「タップ」や本体の「回転」は、JavaScriptでも取得することができます。 つまり、Webサイト・Webアプリでこれらのイベントを捕まえてプログラムを作ることができるという訳。 簡単なサンプルを作ってみましたので、お試しください。 iPhoneのタップ・回転イベントをJavaScriptで取得するサンプル(iPhoneで確認してください) まずは、こんなHTMLを準備して・・ <dl class="iPhoneDL"> <dt>イベント</dt> <dd id="dEvent">なし</dd> <dt>X位置</dt> <dd id="dX">-</dd> <dt>Y位置</dt> <dd id="dY">-</dd> <dt>向き</dt> <dd id="dTurn">-</dd> </dl> プログラムは次の通り。 <script type="text/java
天野 仁史(あまの ひとし、1982年1月7日 - )は、日本のソフトウェア技術者。JavaScriptを主な題材とするブログ[1]で知られ、はてなダイアリー内において 2010年時点で購読者数、オンラインブックマーク数が共に上位に入る人気ブログ[2]となっている。Developers Summit 2007 にて「JavaScript の現在と未来」講演。ベストスピーカー賞受賞。 元サイボウズ・ラボ株式会社所属、2010年9月にオーマ株式会社に転職した[3]。通称 amachang (あまちゃん)。 [編集] 概略 ブログ記事「一行で IE の JavaScript を高速化する方法」[4]で、Webエンジニア界隈に広くその名を知られるようになり、その後、技術者向けのイベントで数々の JavaScriptに関する講演をこなし、また技術雑誌等にも執筆するようになった。 [編集] 経歴
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く