タグ

2013年3月6日のブックマーク (12件)

  • jQueryに学ぶJavascriptの基礎(2) this 活用──jQuery解読(17)

    jQuery解読作業を進めるにつれ、Javascriptの基礎が如何に分かっていないか、ほぼ毎日のように痛感させられます。その意味ではjQuery解読は無謀なチャレンジであった訳ですが、それでも誤謬を犯すマイナスを埋め合わせて遙かに余りあるプラスがあることも毎日自覚されるので、恥を忍んで引き続きjQuery解読を進めるつもりでいます。 しかし、基礎の基礎が余りに分かってない自分に嫌気が指してきてしまい、匙を投げ出すような醜態は演じたくありません。そこで、自戒を込めて敢えて誤解していたこと、理解していなかったこと、不十分な理解に留まっていたことなどについて、つらつらと記述していきたい、と思います。 thisとは何か? 「this」──Javascriptを始めたばかりの素人は、直ぐに「thisって何?」と躓きます。しかも度々、あちこちで登場するので、どうも役割がいくつかあるらしいと気がつくと

  • 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.

  • 知っておくべきjQueryオブジェクトの扱い :: 5509

    jQueryオブジェクトからDOM要素にアクセスする方法やメソッドで渡されるjQueryオブジェクトの扱いなど基といえば基ですが、再認識メモです。なので、タイトルは自分に覚えとけよってことです。。 jQueryオブジェクトからDOMにアクセスする $(‘#id’)にすれば#idを取得できますが、この状態だとDOM要素を選らんでいる状態ではないので、DOM要素のプロパティにはアクセスできません。 $('#link').href // これは無理 1-1. $()[0] 要素を引数にしたjQueryオブジェクトはDOM要素が配列で格納されている状態なので $('#link')[0] // DOM要素の参照になる console.debug($('#link')[0]); // 評価結果 - DOM要素 // とすることで配列の中からDOM要素を指定することができるので、プロパティにアクセス

  • 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を使い始めたときに感じる13の疑問 : tech.kayac.com - 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
  • jQuery親要素、子要素、兄弟要素取得のまとめ

    ※各メソッドにかいてある[条件]ってのは、タグ名やid、クラス名を指定するってことです。 条件を入れると、条件にあったものだけが取得されるようになります。 例:$(elem).parent("div.class-name, #id"); 通常のJavaScriptでの要素取得方法は→[JavaScript] 親要素・子要素・兄弟要素の取得方法 ■親要素の取得 □parent([条件]) 親要素の取得。 すぐ上の親要素のみ。さらに上の先祖要素にはさかのぼらない。 $(elem).parent("div"); 親要素がdivだったら親要素が取得できる。divじゃなければ空。 □parents([条件]) parent()と違い親より上の先祖要素までさかのぼる。 $(elem).parents(".class-name"); class-nameというクラス名がついた先祖要素のみ取得 □clos

  • jQueryでhover時の処理を指定時間だけ遅らせる方法 - with the flow

    jQueryを使っているサイトで、以下のことをやりたいときにどうすればいいのか、調べてみました。 ・特定要素にmouseenterした時に、別途作ったプルダウンで情報を出したい。 ・そのプルダウン内には、マウスオーバー時にDBへAjaxでリクエストし、動的に取ってきたデータを入れたい。 ・但しこれだと、マウスホバーするたびにリクエストされてしまう(マウスポインタがチラッと乗っかっただけでも行われる)。負荷軽減のため、mouseenterして一定時間経過後(500ミリ秒とか)にリクエストを出すようにしたい。 ・hoverIntentという有名なjQueryプラグイン使うと可能にはなるが、プラグイン使わずにもっと手軽にやりたいというわがまま付き。 やり方が悪いのか、普通にsetTimeout/clearTimeout使っても反映されない(タイマー自体はセットされるがmouseleave時にクリ

    jQueryでhover時の処理を指定時間だけ遅らせる方法 - with the flow
  • jQueryでthisの子要素を取得するやり方いろいろ | Base Views

    公開 2010年6月6日(日) 更新日 2014年8月18日(月) スポンサーリンク jQueryを使っていて、thisとその子要素を同時に指定したい場合がある。 結構いろんなやり方があるみたいで、取りあえず使いやすそうなので下の3通り。 $("hoge",this) $(this).children("hoge") $(this).find("hoge") 一番上がシンプルでいいかと思うんですが、取得したいthis直下の要素名をthisの手前に書くんですね… 使いどころは多そうですが、例えば下みたいなの。「Click1」をクリックしたらその直下の<div>が隠れるようにしたい場合とか。 <ul> <li>Click1 <div> <h2>Menu1</h2> <p>text1</p> </div> </li> <li>Click2 <div> <li>Menu2</li> <li>tex

  • スマホでアニメーションするときはcss3の「translate3d」を使おう

    Posted: 2011.09.16 / Category: javascript / Tag: CSS3, jQuery, アニメーション スマートフォン向けのサイトでアニメーションさせたいとき、PCサイトのようにjQueryのanimateを使ってしまうと動きがガタガタになってしまい。これがWebアプリの限界なのかー。って叫びそうになりますが、そんなときはcss3の「translate3d」を使えば滑らかに動きますよ。 jQueryのアニメーション たとえばある要素をクリックしたときスライドするアニメーションをjQueryで書くとこんな感じですね。 javascript $('#rect').click(function(){ $(this).stop().animate({'marginLeft' : '300px'}, 300); }); css3のアニメーション 同じことをcss

    スマホでアニメーションするときはcss3の「translate3d」を使おう
  • RALLY

    F F an Study I I kon Pass Destinations G G lobeKit I I kon AR Maps E E xperience Center E E ven B B oundary Supply J J aybird I I n-Car Navigation T T actical Mapping I I nside Design Y Y ouMap C C hat F F ranklin Square S S NKRS F F ox Sports S S tance G G lobal Payments L L uxe Valet E E picurrence B B oston Globe G G enworth W W orld Atlas E E SPN FC M M erchant App C C ity Guides N N ational P

    RALLY
  • jQueryでフォームの値を取得する方法をまとめておくので、コピペでご利用ください。 | Ginpen.com

    必要ならどうぞ。 デモ jQueryでフォームの値を取得する方法をまとめ – jsdo.it – Share JavaScript, HTML5 and CSS jQueryでフォームの値を取得する方法をまとめ – jsdo.it – share JavaScript, HTML5 and CSS 共通:要素の探し方 input要素なんかにid振っちゃうのが一番なんだけど、属性セレクターを使うと楽な場合があります。つまり[name=xxx]で検索するやり方。 <form id="my-form"> <input type="text" name="my-text" value="This is text." /> </form>

    jQueryでフォームの値を取得する方法をまとめておくので、コピペでご利用ください。 | Ginpen.com
  • 『いつ使うの?今でしょ!』講師が熱弁する授業風景の無料写真素材をリリースしました。 - すしぱくの楽しければいいのです。

    公開日:2013年3月 6日 カテゴリ:モデルリリース PAKUTASOでいつ撮るの?今でしょ! っというノリで、写真素材の撮影をしてきましたよ。いやはや、大川さんが新しいステージに進んだ今回の素材、是非ともブロガーの皆さん筆頭にご利用頂ければ幸いです。 盛り上がってますねー「今でしょ!」 東進のCMが人気を博してTOYOTAのCMに出演とかすごいですねー。 林先生のブログはものすごく読みやすいです。物書きさんは一度目を通すといいかも。「いつやるか? 今でしょう」と始めた林 修の日々雑感 そんなこんなで、特長的なドヤッ顔により火がつきまして、 【画像元 Twitter / 8stl: いつ卒業するの? ...】 あとは、夢の共演なども派生しております。、 【今でしょ】東進の林先生と川越シェフと照英がプリキュアだった頃の画像ください:【2ch】ニーてつVIPブログ ほどよくカオスなわけです

    『いつ使うの?今でしょ!』講師が熱弁する授業風景の無料写真素材をリリースしました。 - すしぱくの楽しければいいのです。
    kkana
    kkana 2013/03/06
    会社で見てしまった・・やばいww