タグ

jqueryに関するikasam_aのブックマーク (44)

  • 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
  • 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
  • Basic Example - jQuery Pseudo Plugin

  • 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 plugin: Tablesorter 2.0

    tablesorter.com 2024 著作権. 不許複製 プライバシーポリシー

  • jQueryサンプル集 | DesignWalker

    jQueryサンプル集 | DesignWalker
  • 細かすぎて伝わらない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
  • 【TB企画】これまでに使った便利なjQueryプラグイン

    これまでに使った20のjQueryプラグイン :: 5509 5509のnoriさんとチャットで会話しているときに nori: みんなでよく使うプラグインをまとめる、とかは? nori: ↑それぞれがまとめる nori: 意外と知らないやつとかあったりするかも hiromu45: 皆さんはどうですかー?大募集! hiromu45: みたいなのやりますか。 なんて話題になったので、TB(トラックバック)企画にしちゃいます! 自分の普段使うプラグインやこれは便利だ!なんてプラグインを書いてエントリーに書いて、トラックバックしてください! 便利なプラグインのまとめ サイトの制作時に使ったプラグインや、これは便利だ!と思っていたプラグインをまとめてみました。今だったら自分で書くかなっていうプラグインも含めてまとめてあります。 jQuery Opacity Rollover http://h2ham

    【TB企画】これまでに使った便利なjQueryプラグイン
  • 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

    jQuery使いが陥りやすい罠 : tech.kayac.com - KAYAC engineers' blog
  • Firebugを活用しよう!jQueryの動作チェックに最適な『FireQuery』

    皆さんご存知のFirefoxのアドオン「firebug」コーダーとかであれば、これを入れている人はかなり多くいると思います! しかし、中には『linker』のまーしーさんや『スグラボ』のフジカワさんのように、”いまいちFirebugを使いこなせていない”なんて人もいるのではないでしょうか? 今回はそんな方もふくめ「FireQuery」のご紹介を仕様と思います!個人的にかなり便利だと思います。 FireQueryとは? FireQueryは、Firebugを便利にさせる機能強化アドオンで、Firebugのコンソールで楽々jQueryを使えるようにしたり、DOM画面イベントがどこについているのかとかを確認することができるようになるツールです。 ただのFirebugでもJavaScriptのデバッグや動作の確認をすることはできたのですが、FireQueryを入れることによって、jQueryを使っ

    Firebugを活用しよう!jQueryの動作チェックに最適な『FireQuery』
  • Firefox 拡張を jQuery で書く! Jetpack を使ってみた。 - IT戦記

    はじめに JavaScript が書ければ、誰でも簡単に Firefox の拡張が書けてしまう。しかも、もれなく jQuery が付いて来る! というものを Mozilla Labs がリリースしたみたいですね。 https://jetpack.mozillalabs.com/ というわけで 少し触ってみました Jetpack Feature の書き方 Jetpack で書く Firefox 拡張を「Jetpack Feature」といいます。 これは、以下の 2 つのものを用意すれば誰でも簡単に公開することが出来ます。 JavaScript ファイル 公開用 HTML ファイル JavaScript ファイル JavaScript ファイルには、 Jetpack Feature のアプリケーションコードを書きます。 (function() { Jetpack.statusBar.appe

    Firefox 拡張を jQuery で書く! Jetpack を使ってみた。 - IT戦記
  • Prototyperに贈るjQuerystからの手紙

    先に 別にどっちがいいという話ではないです。 向き不向きはありますが、どちらもフレームワークとしての完成度は高いです。(Prototype.jsも1.6.0でDOM Readyサポートしたし) 先に 具体的には以下のような使い分けがおすすめ Prototype.js 速度が要求される演算 複雑なアルゴリズムを使用した計算 他のクラスを拡張した処理(google mapsとか) jQuery 簡単なDOM操作 イベント処理 ブログパーツ

  • prototype.jsからjQueryに移行する際に引っかかった点とか(後悔した) - uncertain world

    ちょっととあるモノつくってたrprototype.jsが重すぎて死ねたのでjQueryに浮気しようとリファクタリングしてたら、 変更箇所が多すぎて絶望した! 変えたら色々と効果ありそうだなーと実感しつつ、やらなきゃよかったとひしひしと感じています…。 まぁ、今度何かでjQuery使うときに取り組みやすくなるからいいやと前向きに考えつつ頑張るます。 jQueryリファレンス(こっちのがいい) http://www.mikage.to/jquery/jquery_ref.html jQueryリファレンス http://www.openspc2.org/JavaScript/Ajax/ref/jQuery/ver1.0.3/index.html jQueryでAjax http://f32.aaa.livedoor.jp/~azusa/index.php?t=ajax&p=jquery_aja

    prototype.jsからjQueryに移行する際に引っかかった点とか(後悔した) - uncertain world
  • 特集:jquery.jsを読み解く|gihyo.jp … 技術評論社

    運営元のロゴ Copyright © 2007-2024 All Rights Reserved by Gijutsu-Hyoron Co., Ltd. ページ内容の全部あるいは一部を無断で利用することを禁止します⁠。個別にライセンスが設定されている記事等はそのライセンスに従います。

    特集:jquery.jsを読み解く|gihyo.jp … 技術評論社
  • jquery.jsを読み解く:第1回 jQueryライブラリ(1~171行目)|gihyo.jp … 技術評論社

    はじめに jQueryとは、John Resigによって開発され、最近非常に注目を集めている Javascriptライブラリです。 JavaScriptHTMLの対話を劇的に改善し、Ajaxなどにより複雑化してきているWebアプリケーション構築に必要な処理を非常に簡潔に書くことができます。また、ブラウザの種類やバージョンによる違いも吸収してくれるため、プログラマの作業量も減らしてくれます。 連載では、jQueryライブラリのコードを読みながら、実装として中で何が行われているのかを見ていこうと思います。 想定している読者は、jQueryライブラリをただ使うだけでなく、やっていることを理解したいという方、使われているコードを応用して自分なりの改造をしてみたい方、新たなプラグインを開発したいという方などです。 今回の連載では執筆開始時点の最新版であるバージョン1.2.2を対象としています。説

    jquery.jsを読み解く:第1回 jQueryライブラリ(1~171行目)|gihyo.jp … 技術評論社
  • jWYSIWYG

    WYSIWYG jQuery Plugin Download jWYSIWYG v0.4 (73.8kb, Compressed) Requires jQuery 1.2.3+ Homepage Author Juan M Martínez, joksnet@gmail.com, Company Updated September 26, 2008 Sites @jQuery, @Google Code, Support Forum, Bug Tracker Description This plugin is an inline content editor to allow editing rich HTML content on the fly. It's an alternative to WYMeditor with much less features. With a smal

  • jQuery:1.3の新機能「live」を試してみる

    jQueryのバージョンが1.3になって増えた新機能「live()」 いまいちよく使い方がわかっていなかったので、 勉強をかねてのメモエントリーを残しておきます。 新機能live() 詳しくないので調べてみた。 live(type, fn) - jQuery 1.3.1 日語リファレンス んーいまいちピンとこないのですが、 追加した要素にもイベントが登録されるというのはわかった。 普通にclick()じゃダメ? では、通常のとliveを使った場合と その二つを作って見比べてみることにした。 まずは通常にclickを使った場合。 ■通常のclickの場合 $(".live").click(function(){ $(this).after('<p>ここをクリックしても何もない</p>'); }); ■プレビュー 見てわかると思うのですが、 最初からある部分以外でクリックしてもなにも変化ない

    jQuery:1.3の新機能「live」を試してみる
  • 激論: Prototype vs. jQuery

    クライアントサイドにおけるウェブ開発の場面で Ajax が当たり前のように用いられるようになり、「どの JavaScript/Ajax フレームワークが最高か」という問いかけをよく耳にするようになった。Glenn Vanderburg 氏が記事の中で Prototype(参考記事リンク) と jQuery (参考記事)を比較すると、業界のエキスパートである Douglas Crockford 氏と Dion Almaer 氏からさまざまなレスポンスが返ってきた。 Glenn Vanderburg 氏は自身がプロとして JavaScript をつかった経験から語り始め、彼がどういう事情で両方のフレームワークをつかって作業するに至ったかを説明する(リンク)。 Rails をつかった開発を経験した多くのプログラマと同じく、わたしは JavaScript ライブラリである Prototype(リン

    激論: Prototype vs. jQuery
  • jQuery SWFObject

    Skip to main content What is the jQuery SWFObject plugin? The jQuery SWFObject plugin is an addon for jQuery that lets you easily embed flash movies on a page. This plugin gives you the best of both worlds; you get the power of SWFObject within the jQuery API. The latest version, 1.1.1, is based on the latest SWFObject version 2.2. The project was started in 2009 with permission from the SWFObject

  • jQuery.opensocial_simple Pluginを作成しました。 - KAYAC Engineers' Blog

    昨日OpenSocial Hackathonに参加させていただきました。agoです。 Hackathonは終わってしまいましたが、jQueryからOpenSocialを簡単に扱うためのPluginを作成したので、jQuery.opensocial_simpleとして公開したいと思います。 opensocial、gadgetsのすべての機能を実装したわけではないですが、owner、viewerの情報取得、外部サイトへの接続はかなり簡単に実装できるようになったと思います。 使い方はjQuery読み込み後、jquery.opensocial_simple.jsを読み込み、$.opensocial_simpleからmethodを呼び出すだけ。 MySpaceアプリの場合以下の形で使用できます。 <script type=" text/javascript"http://api.msappspace

    jQuery.opensocial_simple Pluginを作成しました。 - KAYAC Engineers' Blog