ページに仕込まれたJavaScriptのイベントを全部見える化出来るブックマークレット「Visual Event」:phpspot開発日誌
画像スライダーに関することならお任せ！なjQueryプラグイン「Slider Kit... 次の記事 ≫：かなりいい感じのWordPressテーマ２０ Allan Jardine | Reflections | Visual Event ページに仕込まれたJavaScriptのイベントを全部見える化出来るブックマークレット「Visual Event」。 JavaScript で開発していて、jQuery等の各種フレームワークや、on〜 を使ってイベントを埋め込むことは多いですね。 後になって、どこにイベントがあるのかをすぐ見える化し、どのような処理が記述されているのか、確認することのできるブックマークのご紹介です。 当サイトにはそれほどイベントが組み込まれていませんので、Yahoo! Japanのトップページで試してみます。 ブックマークレットを起動すると、グレーアウトされ、エレメントの上
これからnode.jsを始める人のためのインストール系エントリまとめ - 小さい頃はエラ呼吸
はじめに node.jsが熱いですね。 これからnode.jsを勉強したり、node.jsで何かアプリケーション作ってみたいという人のために、node.jsの環境構築（インストール）系のエントリを集めてみました。 サーバサイドJavaScript Node.js入門posted with amazlet at 14.02.16清水俊博 大津繁樹 Jxck 小林秀和 佐々木庸平 篠崎祐輔 高木敦也 西山雄也 アスキー・メディアワークス 売り上げランキング: 247,116 Amazon.co.jpで詳細を見る プラットフォーム別に分けてみましたので、お好きな環境でnode.jsに触れてみてください。ざっと眺めてみた感じ、Macでやるのが一番簡単みたいです。 Windows + cygwin Windowsでもcygwinを入れてあげてればnode.jsは動きます。 node.jsをWindo
ASCII.jp：HTML5 videoでニコニコ動画風プレーヤーを作ろう (1/7)
HTML5テロッパーのサンプル。テキストエリアの文字がテロップとして動画の上に表示される画像クリックでサンプルページを表示します（Firefox 3／Opera 10／Safari 4で表示可能） 動画投稿サイト「ニコニコ動画」が人気です。ニコニコ動画はユーザーのコメントを再生中の動画にテロップのように表示する機能が特徴で、多くのユーザーがコメントを書き込んで楽しんでいます。 ニコニコ動画のようにブラウザー上で動画を再生しながらテロップを表示するには、従来、Flashが必要でした。Flash（Action Script）に習熟している開発者でなければ、ニコニコ動画のようなWebサービスは作れなかったのです。ところが現在、モダンブラウザーへの実装が進んでいるHTML5 videoなら、JavaScriptを使って簡単に文字や画像を動画に重ねられます。 今回はHTML5 videoとJavaS
JavaScript基本概念最速マスター - TechTalkManiacs
プログラミング言語の文法をまとめた最速基礎文法マスターが流行っていますが、それだけだと物足りないので少し視点を変えてJavaScriptという言語の基礎となっている概念について簡単にまとめてみようと思います。(基礎文法についてはこちらを参照してください) (20010/2/4 記述ミス Typoなどを修正しました) JavaScriptの基本概念 JavaScriptの基本となる概念は次の二つです。 連鎖指向 全てがオブジェクト 連鎖指向はプロトタイプチェーンやクロージャ、全てがオブジェクトであるという性質は連想配列やプリミティブ型などの性質に関わってきます。 連鎖指向 JavaScriptでは変数、オブジェクト、メソッドなどのリソースの利用において鎖のようにリソースを定義や宣言できるポイントが連なり、一番近くの宣言や定義に基づいてリソースの内容が決定される、という仕組みが採用されています
PHPのあの関数をJavaScriptでやるには？をまとめた「phpjs.org」:phpspot開発日誌
PHPのあの関数をJavaScriptでやるには？をまとめた「phpjs.org」 2009年12月04日- PHPのあの関数をJavaScriptでやるには？をまとめた「phpjs.org」が便利です。 PHPを使っていて、JavaScript もかいているときに、PHPのあの関数をJavaScript で実装したいんだけどなぁ、という場合に索引から牽けて参考になります。 例えば、functions ページには使える関数がまとまっているのですが、array系、ソート系、入力チェック系やオブジェクト指向系、日付、ファイルシステム系、Math系、ハッシュなど実に多数のJavaScript用php関数が掲載されています。 例えば、addslashes だと次のような感じでJSのソースが見れます。 function addslashes (str) { return (str+'').repla
HTML5入門：アニメーションの実装方法３種
HTML5・CSS3のような新しい技術の問題点は、HTML4やらFlashなどの枯れた技術と違ってノウハウ・ライブラリ・ツールとかがまだ十分にそろっていない事。普及のタイミングもまだはっきりとしていないこの段階で手を出せない・出しにくいと感じている人が多いのも良く理解できる。 私から見れば、逆に「こんな楽しい状況は滅多にない」わけで、商売になるかならないかは二の次にしていろいろと試したくなる。 今日作ったのは、HTML5+CSS3上で可能になる（ただし現在ではWebkit独自の拡張を含む）３つのアニメーション・テクニックの比較（左に貼付けたものがそれ、Safari/Chromiumだとすべて動く。Firefox/OperaだとDOMとCanvasのみ（ただし別ウィンドウで開かないとCanvasが動かないークロス・ドメインセキュリティのバグか？））。 詳しくはソース（参照）を見ていただければ
超クールなJavaScriptプラグイン40 – creamu
nettuts+で、超クールなJavaScriptプラグインがまとまっています。 いくつかご紹介しますね。 » JQuery Validate jQueryによるクライアントサイドのバリデート » PrettyCheckboxes – jQuery FancyFormと似たかわいいチェックボックスを作るjQueryライブラリ » Thickbox 画像だけでなくテキスト等も読み込めるlightbox » FancyBox 超クールなFancybox。画像をすーっと拡大してくれる。デザインがMacライク » Slideshow 2! for MooTools とてもクールなMooToolsによるスライドショー » SmoothGallery こちらも超クールなスライドショー。MooTools v1.11を使用 » DynamicDrive – Carousel Slideshow 3Dに魅せ
jQueryを使い始めたときに感じる13の疑問 : tech.kayac.com - KAYAC engineers' blog
来週は私が夏休みなので更新はない予定です。agoです。 最近、人にjQueryを解説する機会があったので、昔を思い出してjQueryを使い始めた頃に感じる疑問を書いてみたいと思います。 1 そもそも何で使うの？いまでも困ってないよ 作成する内容にもよりますが、慣れると使用しない場合に比べて記述するコード量が3分の1程度まで減ります。 また、変数、条件分岐、繰り返しが減るのでバグが発生しにくくなります。 2 何か特殊なことができる？ 結局できることは変わりません。 jQuery自体JSで書かれてますし、記述の自由度もJSの制約に制限されます。 3 何が難しいの？ 文法がややjQuery的になります。 参考 jQuery言語入門 jQuery自体のコード量は少ないのですが、独特の記述法が多く慣れるまで多少時間がかかるかもしれません。 また、CSS Selectorの知識はほぼ必須です。 特にマ
jQuery言語入門 : tech.kayac.com - KAYAC engineers' blog
先月の社員PVランキングは91番目でした。agoです。 たまに他言語開発者から「JSは何となくわかるけど、jQueryが特殊すぎてよくわからない」という声を聞きます。 個人的にjQueryを使う場合、「JSの中でjQueryを使う」と言うより、「jQueryの中でJSを使う」と考えた方が理解しやすいと思うので、今日は"jQuery言語"の書き方を紹介したいと思います。 文法 Traversing methodでインデントを下げて、.end()でインデントをあげます。 （Traversing以外のmethodはインデントを維持します） そして、末尾には開始行と同じ位置に「;」を置きます。 $('body') .find('a') .filter('.permlink') .attr('href', function () { return $(this).attr('href').repla
PHPコードからJavaScriptコードを学ぶ:phpspot開発日誌
PHPコードからJavaScriptコードを学ぶエントリが公開されています。 まず、PHPのコードを紹介し、JavaScript ではこのように書く、という変換結果が色々紹介されています。 変数スコープ、型、キャスト、空チェックなどの比較がされており、言語仕様の細かな違いについても学習できます。 PHPerでJavaScriptも学びたいという方は参考に出来るかもしれません。 Learning JavaScript from PHP - a Comparison | Lullabot あれ、JavaScript ではどうやって書くんだっけ？という場合のリマインドにも使えます。
PHP で引数をそのまま返す関数を作っておくと便利 - IT戦記
PHP では以下のように new してすぐメソッドを呼べない <?php new DateTime()->getOffset(); なので、引数をそのまま返す関数を作ってやると <?php function expr($a) { return $a; } expr(new DateTime())->getOffset(); // OK! 便利だなー おまけ 配列アクセス用のも作っておくと便利 <?php function expr($a) { return $a; } function idx($array, $i) { return $array[$i]; } echo idx(idx(expr(new DateTimeZone('Asia/Tokyo'))->getTransitions(), 0), 'abbr') . "\n"; おまけ2 無名関数をそのまま呼ぶときにも使える。 <
jQuery使いが陥りやすい罠 : tech.kayac.com - KAYAC engineers' blog
肩こり歴20年のagoです。 社内でもjQueryを使う人間が増えてきたので、jQueryを使う人が陥りやすい罠をいくつかあげてみたいと思います。 （私が過去にはまったり、今はまっている罠です） 1 グローバルの名前空間を使わない jQueryはwindow objectの汚染が少なくほかのライブラリとの共存が行いやすいですが、特定のサイト向けに開発する場合window objectを使用してもそれほど問題は発生しません。 しかしjQueryに慣れるとwindow objectの使用をいかに避けるかを考えるようになり、jQueryと関係ないfunctionや変数まで$.hogehogeに実装しようとしてしまいます。 これはwindow objectの代わりにjQuery objectを汚染しているだけなので、素直にwindow objectを使用したほうが普通に実装しやすいでしょう。 2
javascript - にはクラスはない : 404 Blog Not Found
2009年06月13日22:00 カテゴリLightweight Languages javascript - にはクラスはない かえってわかりにくくなっている感じをかつてさんざん実感したので。 JavaScriptのオブジェクトについて考察してみた - あと味 JavaScriptにおけるほとんど全てのデータはオブジェクトである オブジェクトの定義にもいろいろありますが、ここでは「メソッドを持つ」という狭い意味においても事実だということです。実際に見てみましょう。 p(true.toString()); p("String".toString()); p((1).toString()); p((3.14159265).toString()); p([0,1,2,3].toString()); p({q:"answer to life, the universe, and everythi
バッドノウハウ通信（全6回）の最終回がgihyo.jpで公開されて完結！
バッドノウハウ通信（全6回）の最終回がgihyo.jpで公開されて完結！ 2009-06-15-2 [Book] WEB+DB PRESS 連載されていた高林哲氏によるエッセイ「BK通信 -Bad Knowhow Tsushin-」の最終回が gihyo.jp で公開されました。 これを記念して全六回をリストアップ。 - #01 JavaScriptのバッドノウハウ http://gihyo.jp/dev/serial/01/bk/0001 - #02 数字のバッドノウハウ http://gihyo.jp/dev/serial/01/bk/0002 - #03 C++のバッドノウハウ http://gihyo.jp/dev/serial/01/bk/0003 - #04 ブラウザのバッドノウハウ <form>編 http://gihyo.jp/dev/serial/01/bk/0004 -
オブジェクト指向っぽい話が分かるかもしれないJavaScript講座 その2 | Takazudo Clipping*
自分なんぞがオブジェクト指向とはなんぞと語るなんておこがましく、「オブジェクトっぽい話」でいいかなーと思っていたのですが、ブックマークするときに「オブジェクト」でタグ付けてる人がいたので、これはいかんと思い、こっそりタイトルを直しました。 2回目の今回は、複数のインスタンスをまとめて操作する方法について書きます。 まんじゅうマネージャー 前回、クラス作ってインスタンスを作ると便利だというところで終わりましたが、便利な点としてはまず、「複数のインスタンスをまとめて操作したり、作ったりできることができる」という点があります。どういうことかというと、とりあえず、以下のサンプルを見てみてください。 まんじゅうマネージャーサンプル まんじゅうを一気に作ったり、隠したりすることができます。 これで賞味期限が切れたりしても大丈夫なはずです。 この機能を作れと言われたら、前回の知識だけは結構厳しいのではな
JavaScript で、画像本来のサイズ(幅, 高さ)を取得する方法 - latest log
Opera で DOM Mutation Event を使用するコードを追記しました。 まとめを追加しました。 Opera パート2に取得できないケースが見つかったため、パート3 を追加しました。 rhino.jpg(幅:300px, 高さ:227px) を、 <img id="rhino" src="rhino.jpg" width="100" height="75" /> と、100 x 75 で表示している場合を例に、画像本来のサイズを取得する方法をご紹介します。 Firefox, Safari, Google Chrome なら image.naturalWidth と image.naturalHeight を利用します。 image.naturalWidth と image.naturalHeight の初期値は 0 です。画像の読み込みが完了した時点で適切な値に更新されます。
JSONの可能性がグンと拡がるぞ！ JSONスキーマ - 檜山正幸のキマイラ飼育記 (はてなBlog)
JSON（http://www.json.org/）データはけっこうよく使うので、何度か話題にしたことがあります（例えば「もう一度、ちゃんとJSON入門」）。でも、JSONには型情報／メタ情報が付けられないのがとても不満で、JSON改なんてもんを考えたこともありました。（後でXIONに改名） JSONデータに対するスキーマ定義の仕様がかたまりつつあることを、ごく最近になって知りました。 http://json-schema.org/ JSON本体はRFC 4627になっていますが、JSONスキーマの標準化のステータスは、あまりハッキリとは分かりません（僕には）。http://groups.google.com/group/json-schema?pli=1 を覗き見した感じでは、現状ワーキングドラフトという位置付けらしいです。 なかなか面白いし役に立ちそうなので紹介します。ただし、僕にとっ
旧・Macの手書き説明書 - FC2 BLOG パスワード認証
ブログ パスワード認証 閲覧するには管理人が設定した パスワードの入力が必要です。 管理人からのメッセージ https://mac-tegaki.comへ移転中 閲覧パスワード Copyright © since 1999 FC2 inc. All Rights Reserved.
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
CreateJS | A suite of JavaScript libraries and tools designed for working with HTML5
[JS]わずか「12文字」でIEを判別するスクリプト | コリス