タグ

ブックマーク / techblog.kayac.com (12)

  • Firebugの意外と知られていない機能紹介(プログラマ向け) - KAYAC Engineers' Blog

    羊毛布団を洗濯機にかけられないことを知りました。ago(@kyo_ago)です。 意外と知られていない機能が多い!?Firebugの使い方を見て、プログラマ向けも欲しくなったので書いてみました。 1. ショートカット一覧 以下のページでFirebugのショートカット一覧が公開されています。 http://getfirebug.com/wiki/index.php/Keyboard_and_Mouse_Shortcuts 取り合えず以下の二つだけでも覚えておくと効率的かもしれません。 F12でFirebugの有効、無効の切り替え 広いコマンドラインモード時にCtrl+Enterでコードを実行 また、以下のメニューからショートカットの変更も行えるので、他の拡張等とショートカットがかぶった場合でも別のキーで使用することが出来ます。 2. Firefox体のツールバーに「要素を調査」ボタン Fi

    Firebugの意外と知られていない機能紹介(プログラマ向け) - KAYAC Engineers' Blog
  • jQueryを読むために知っておきたい6つの知識 : tech.kayac.com - KAYAC engineers' blog

    夏休みはタイ古式マッサージセミナーに参加してきました。agoです。 先週日曜日若手IT勉強会に参加させていただき、jQueryのコードリーディングを行ってきました。 そこでjQueryのコードを読むときの基礎知識に関して簡単にまとめてみたいと思います。 1 変数の複数同時宣言と代入 まず、JSでは変数の宣言は以下のような形式で行います。 var hoge; この場合は単一の変数の宣言ですが、以下のような記述を行うと複数の変数を同時に宣言することが可能です。 var hoge, huga; また、変数宣言と同時に値の代入を行うことも可能で、その場合以下のような記述になります。 var hoge = 'test'; さらに複数の変数宣言と、値の代入は同時に行うことが可能で、その場合以下のような記述になります。 var hoge = 'test1', huga = 'test2'; jQuery

    jQueryを読むために知っておきたい6つの知識 : tech.kayac.com - KAYAC engineers' blog
  • jQuery1.4の新機能を1.4だけに14個 - KAYAC engineers' blog

    時が経つのは早いもので、ぼーとしてたらもう1月も終わりそうですね。外村です。 先日リリースされたjQuery1.4で新しく追加されたメソッドや新しい使い方ができるようになった機能を全部ではないですがいくつか紹介します。以下に変更点が全て掲載されているのでそちらも参照するといいと思います。 Version 1.4 ? jQuery API 新規で追加されたメソッド 1. nextUntil()、prevUntil()、parentsUntil() 指定したセレクタまでの要素を返します。以下の例ではitem3とitem4の後ろにテキストが追加されます。 <ul> <li id="item1">item1</li> <li id="item2">item2</li> <li id="item3">item3</li> <li id="item4">item4</li> <li id="item5

    jQuery1.4の新機能を1.4だけに14個 - KAYAC engineers' blog
  • KAYAC Engineers' Blog

    SREチームの長田です。 今回は、カヤックのメンバーが業務で使うために開発・公開しているOSSなプロダクトをまとめて紹介しようという企画です。 KAYAC organization以下にあるものだけでなく、在籍中のメンバーが作ったものもひっくるめて、実際に業務で使用しているものを中心に 紹介しています。 以下の3つのカテゴリに分けて記載しています。 各カテゴリ内はアルファベット順です。 ツール編 人間が手動で実行するもの アプリケーション編 どこかに常駐して、イベントを受け取ると動作するもの ライブラリ編 ツールやアプリケーションから参照されるもの 集めてみたらそこそこの量になったので、記事では詳細な説明は省いています。 GitHubリポジトリのURLや関連記事のリンクを併記していますので、より詳しく知りたい場合はそちらを参照ください。 (...) 内はそのプロダクトで使用している主なプ

    KAYAC Engineers' Blog
  • tech.kayac.comで公開されたjQuery関連記事まとめ(~2009年版) : tech.kayac.com - KAYAC engineers' blog

    最近、このブログの方向性に危機感を抱いています。agoです。 そろそろあちこちで「2009まとめ」的な記事が見られるようになってきましたが、tech.kayac.comでもjQueryに特化してまとめてみたいと思います。 jQueryを使ってphpで言うところのstrip_tagsとかhtmlspecialcharsする方法 かなり簡易的な方法ですが、それぞれ一行で出来たので記事にしてみました。 JSをphp的に使用したい場合、php.jsと言うのもあるようです。 jQuery.liveをfirefoxで使うときの注意点 jQuery 1.3系でサポートされた$().live()で実際はまった問題の紹介です。 JS制作に欠かせない3つのツール Flash制作に欠かせない3つのツール・まとめ編 | エントリー | _level0.KAYAC _level0.KAYACとの連動記事です。 jQ

    tech.kayac.comで公開されたjQuery関連記事まとめ(~2009年版) : tech.kayac.com - KAYAC engineers' blog
    imai78
    imai78 2009/12/24
    非常に為になるマトメ!
  • javascriptでカンタン経路検索 : tech.kayac.com - KAYAC engineers' blog

    数え切れないほどのYUREXと一緒に住んでいた渡邊です。 今の時代、ブラウザさえあれば経路情報をカンタンに取得することができます。 今回はGoogleの経路検索APIjavascriptとブラウザを使います。 1. 結果を見る 弊社、自由が丘オフィスから鎌倉社までの経路についての、 APIレスポンスをまとめたものは下記の通りです。 route.json 2. 確認する 出発地名と到着地名を入力して経路検索ボタンを押すと、 Firefoxのconsoleに経路検索結果をまとめたオブジェクトが表示されます。 consoleオブジェクトが無いブラウザの場合は、アラートで簡潔にお知らせします。 ※都道府県名を含めない場合、結果が出ないことがあります。 出発地名: 到着地名: 3. 主要なクラスのリファレンス クラス GDirections - Google Maps API リファレンス クラ

    javascriptでカンタン経路検索 : tech.kayac.com - KAYAC engineers' blog
  • 使ってはいけないjQueryの機能 5個 : tech.kayac.com - KAYAC engineers' blog

    3 days ago的な時間表記をするサービスは全部嫌いです。agoです。 週末若手IT勉強会に参加させていただきjQuery 1.3.2のイベント周りを読んできたので、それを踏まえて使用すると問題の発生する可能性の高い機能を紹介します。 0 jQuery.browser 1.3からサポート外になりました。 代わりにjQuery.supportを使用しましょう。 ただ、swfの重ね合わせ問題等は単体のJSでは確認できないので、jQuery.browser無しでどう解決すればいいのかよくわかっていません。 1 getData、setDataイベント getData、setDataイベントは1.5系で削除される予定のようです 最新版のjQueryではgetData、setDataイベントが使用可能になっており、以下のようにイベントを設定できます。 $().bind('getData', fun

    使ってはいけないjQueryの機能 5個 : tech.kayac.com - KAYAC engineers' blog
  • 「入門 GIT」が神本である件。 git 利用者だけでなくすべての開発者が読むべき本 - KAYAC Engineers' Blog

    ども。自分のサイトを復旧させるのが面倒なため会社のブログにのレビューまで乗せようという魂胆の村瀬です。 週末に「入門GIT」を読んだのですがこのは git ユーザーはもちろんのことその他すべての開発者が必読のだなぁと感じたので紹介しておきます。 このです。 このは現在の git の開発者でありメンテナーである濱野氏によって書かれた git の入門です。 ただの入門にあらず しかし入門だから最初はよくあるようなチュートリアルのような記事からはじまるのだろうと思っていると最初から面らいます。 最初に書かれているのは git がどのようにデータを記録し、どのように履歴をたどれるようになっているかというまさに git 自体の基が書かれているのです。 僕個人は二年近く git を使用してきているため自分の知識の確認のような感じで読み進められましたが、初めての方はすこしむずかしいか

    「入門 GIT」が神本である件。 git 利用者だけでなくすべての開発者が読むべき本 - KAYAC Engineers' Blog
  • jQuery時代に生きるクロスブラウザ対応の知恵 8選 : tech.kayac.com - KAYAC engineers' blog

    Auto Copyが移植されたらchromeへの移行を検討します。agoです。 jQueryを使用するようになってクロスブラウザを意識することは少なくなりましたが、それでもjQueryではカバーしきれない差異はそれなりにあります。 そこでjQueryを使っていてもはまる可能性の高いクロスブラウザのtipsをご紹介したいと思います。 1 Objectリテラル内の末尾カンマ { 'key' : 'val', } 上記のコードはIE6でエラーが出ます。 o = { ‘key’ : ‘val’, }; この動作はjavascriptの仕様からするとIE6の動作が正しく、来であれば末尾のカンマは記述できません。 これは他言語でJSONを扱う場合でもエラーになるので注意してください。 また、Arrayの場合、Fxは上記と同じく要素が存在しないものと認識しますが、IE6は未定義値が定義されていると解釈

    jQuery時代に生きるクロスブラウザ対応の知恵 8選 : tech.kayac.com - KAYAC engineers' blog
  • 細かすぎて伝わらないjQueryの機能5選 - KAYAC Engineers' Blog

    実は技術部ではなく、演出部所属のagoです。 先日jQuery 1.3.2のソースを読む機会があり、そのときいくつか気づいたことがあったのでまとめてみました。 1 .addClass, removeClassはスペース区切りで複数のclassを渡せる .addClass, removeClassにはスペース区切りで複数のclass nameが渡せます。 //classの順番は保持します。 //<div class="hoge gege">があった場合、<div class="hoge gege huga">になります。 $('div').addClass('hoge huga'); //<div class="hoge gege huga">があった場合、<div class="gege">になります。 $('div').removeClass('hoge huga'); ただし、hasC

    細かすぎて伝わらないjQueryの機能5選 - KAYAC Engineers' Blog
  • jQuery Pluginの書き方 - KAYAC Engineers' Blog

    最近いくつかjQueryPluginを書く機会があったのでちょっとまとめてみようと思います。 (function($) { //このPluginの名前 var name_space = 'basePlugin'; $.fn[name_space] = function(options) { //いったん退避 var elements = this; //設定情報の構築 var settings = $.extend({ //optionの初期値を設定 'param' : 'value' }, options); //内部用method var inner_method = function () { //内部の共通処理の記述 }; //要素を一個ずつ処理 elements.each(function() { $(this) //イベント等の設定 .keyup(inner_method) ;

    jQuery Pluginの書き方 - KAYAC Engineers' Blog
  • 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

    jQuery言語入門 : tech.kayac.com - KAYAC engineers' blog
  • 1