タグ

関連タグで絞り込む (0)

  • 関連タグはありません

タグの絞り込みを解除

JavaScriptとjavascriptとjQueryに関するasiamothのブックマーク (119)

  • The 20 Most Practical and Creative Uses of jQuery - Nettuts+

    All-in-one creative subscription with full AI stack All-in-one creative subscription From $16.50/m

    The 20 Most Practical and Creative Uses of jQuery - Nettuts+
    asiamoth
    asiamoth 2009/02/07
    class で絞り込んで表示する方法。jQuery らしくエフェクトがかかる。応用できそうなアイデア。
  • jQuery Plugin作成時の3つの注意点 - KAYAC Engineers' Blog

    実家に帰ったら犬に威嚇されました。agoです。 jQuery Pluginに関しては、以前jQuery Pluginの書き方として基的な部分をまとめたのですが、もう少し細かい部分に関して再度まとめてみようと思います。 1 $.dataの活用 以前jQuery.dataの使い方でも紹介したのですが、Pluginからelementを処理する場合対象のelementが広範囲に及ぶことが多く、Plugin内の変数の他に各element毎の変数を持ちたくなることがあります。 たとえば、「クリックする毎に順番にCSSが変わるPlugin」を考えた場合、各element毎に「今どのCSSが指定されているか」を保持できると実装が楽になると思います。 具体的には以下のような形になります。 $(function () { var colors = ['blue', 'yellow', 'red']; $('

    jQuery Plugin作成時の3つの注意点 - KAYAC Engineers' Blog
    asiamoth
    asiamoth 2009/01/16
    まだまだ jQuery の知らない部分が多いな……。/ $.data, ショートカット method, イベントネームスペース
  • jQueryやPrototype.jsのセレクタ関数の動作速度を二倍にするライブラリを作りました - ?D of K

    と言っても、前々から作っているセレクタ関数が依存無しで簡単に切り出せそうだったから、切り出しただけです。 http://kquery.if.land.to/ksk.js 動作ブラウザはIE5.5以上です。これを導入するとIE5でも動作します。 使い方 ksk("div"); // divタグを取得します ksk("p", document.body); // body要素以下のpタグを取得します ksk("a", document.getElementsByTagName("p")); // p要素以下のaタグを全て取得しますセレクタはCSS3のやつを大体実装しています。最大の特徴は複数の要素以下の探索に対応していることです。kQueryが実際に完成したら、$(selector).find(selector)とかは高速かつ正確に処理できる予定です。 既知のバグとか 親要素のチェックが甘いで

    jQueryやPrototype.jsのセレクタ関数の動作速度を二倍にするライブラリを作りました - ?D of K
    asiamoth
    asiamoth 2009/01/13
    ofk さんは とんでもないものを作ってしまったようです。/ 本当、CSS セレクタ最強チームの日本人があと 1 人いたら、世界制覇できそう。
  • bizcaz.com

    asiamoth
    asiamoth 2009/01/04
    あ、元ファイル無くなっていたのか。ありがたく使わせてもらおう。
  • jQuery でテキストエリア内の文字はどのメソッドで取得する? | JavaScript | かたつむりくんのWWW

    「jQuery でテキストエリア内の文字はどのメソッドで取得する?」と、ちょっと疑問に思ったので実験した備忘録です。 jQuery では、指定した要素の中の文字列は「 .text() 」、指定した要素の中のHTML は「 .html() 」で取得できます。また、input 要素( type="text" )の value については「 .val() 」で取得できます。 さて、では textarea 要素の中の文字列については、上記のすべてのメソッドで取得できそうなのですが、実際のところどうなの?というのが今回の疑問です。 問題 ここにテキストエリアとボタンが一つずつあります。 テキストエリアの初期値は「かたつむりくん」です。ボタンをクリックすると、「 .text() 」「 .html() 」「 .val() 」の三つのメソッドでテキストエリア内の文字列を取得し、下の定義リストの項目名の下の

    jQuery でテキストエリア内の文字はどのメソッドで取得する? | JavaScript | かたつむりくんのWWW
    asiamoth
    asiamoth 2008/12/31
    テキストエリア内の文字を取得するには、.val() を使うのが良い。それにしても、IE ……。
  • google-code-prettify + jQuery でソースコードをハイライトする | JavaScript | かたつむりくんのWWW

    ソースコードをハイライト表示してくれる JavaScript ライブラリは数多くありますが、今回、このブログに google-code-prettify というライブラリを導入してみました。 少し前までは dp.SyntaxHighlighter(ソースコードをカラフルに読みやすくする - dp.SyntaxHighlighter )を使っていましたが、どうもイマイチ好きになれなかったので使用をやめていましたので、久しぶりのハイライト表示です。 google-code-prettify については、導入方法も含めて「【ハウツー】ハイライトもGoogle流 - "google-code-prettify"でソースコードに色付けを | マイコミジャーナル」で分かりやすく説明されていますので、ここでは jQuery を使っている環境下で、ブログ記事内のソースに一切手を加えない導入方法を紹介します

    google-code-prettify + jQuery でソースコードをハイライトする | JavaScript | かたつむりくんのWWW
    asiamoth
    asiamoth 2008/12/31
    jQuery でクラスを追加するだけでハイライト表示。
  • jQuery でファイルをインクルードする ( jQuery によるモジュール化) | JavaScript | かたつむりくんのWWW

    jQuery でファイルをインクルードする ( jQuery によるモジュール化) 通常のスタティックな Web サイトにおいて、Web ページの中で更新頻度の高いパーツを別ファイルにして、それをインクルードするシーンは多々あるかと思います。 Movable Type でも、モジュールやウィジェットを「インデックステンプレートのコンテキストで全ページに表示させたい」なんてとき、インデックステンプレートに読み込み用のファイルを作って、それを MTInclude で読み込むという手法... 通常のスタティックな Web サイトにおいて、Web ページの中で更新頻度の高いパーツを別ファイルにして、それをインクルードするシーンは多々あるかと思います。 Movable Type でも、モジュールやウィジェットを「インデックステンプレートのコンテキストで全ページに表示させたい」なんてとき、インデックス

    jQuery でファイルをインクルードする ( jQuery によるモジュール化) | JavaScript | かたつむりくんのWWW
    asiamoth
    asiamoth 2008/12/31
    これはいいスクリプト!jquery.inc も使いやすかったが、“インクルードを指定した要素の子要素としてしか読み込めない”のは たしかに面倒だった。
  • jQuery1.3 β1が出たみたいです - monjudoh’s diary

    jQuery 1.3 beta: Sizzling and feature testing - Ajaxian 特徴としては CSSセレクタエンジンにSizzleを採用 CSSセレクタでの要素の取得が速くなる まあ自分で開発しているWebサイトなら適切にid振ったりしているだろうからあんまり効果はないのかも ブラウザテスト廃止 例えば今まで「jQuery.browser.msie && !jQuery.isXMLDoc(this)」としていた条件が「!jQuery.support.noCloneEvent && !jQuery.isXMLDoc(this)」となる。 ある機能が使えるかどうかの判断をどのブラウザかではなく、新しく導入されたどの昨日をサポートしているか見る為のプロパティ(jQuery.support)を使うようにする、ということのよう。 あくまでjQuery体ではブラウザテ

    jQuery1.3 β1が出たみたいです - monjudoh’s diary
    asiamoth
    asiamoth 2008/12/27
    .append() などが早くなったらしいが、どのような仕組みだろう? 気になる……。
  • http://max.jsrhost.com/ajaxify/

    asiamoth
    asiamoth 2008/12/27
    通常のリンクタグ(a)を AJAX 対応にする(らしい)jQuery プラグイン。
  • jQueryを良くする25のTIPS

    jQueryを良くする25のTIPS ネタ元:Improve your jQuery - 25 excellent tips ちょっと多いですが、かなり良いTIPSがまとまっています。 Google AJAX Libraries APIを利用しよう Google AJAX Libraries APIを活用すればすばやくライブラリを読み込むことが出来ます。 <script src="http://www.google.com/jsapi"></script> <script type="text/javascript"> // Load jQuery google.load("jquery", "1.2.6"); google.setOnLoadCallback(function() { // Your code goes here. }); </script> 直接読み込むことも出来ます。

    jQueryを良くする25のTIPS
    asiamoth
    asiamoth 2008/12/21
    最適化のためのプログラミング、にならないように、ほどほどにしよう。/ append() と html() は働きが違うので、そのまま置き換えはできないような?
  • jQueryを使うときに気をつけるべき8のポイント : tech.kayac.com - KAYAC engineers' blog

    DAHONのBoardwalkを修理しようとしておもいっきり壊してしまいました。agoです。 普段はjQueryをメインで使用しているのですが、使っていていくつか注意すべき点があったのでまとめてみました。 (一部jQueryではなく、DOMの仕様上の制限も含まれています) 1 $().filterにstring以外のものを渡すとエラー 1.4系では修正されていました $().findや$().notは大丈夫ですが、$().filterの場合引数にjQuery objectや配列、html elementなどを渡すとエラーになります。 (たとえばjQuery objectを渡した場合、Firefoxでは「TypeError: t.substring is not a function」というエラーが発生します) 確認する ちなみに、$().findや$().notはstring以外も渡せるた

    jQueryを使うときに気をつけるべき8のポイント : tech.kayac.com - KAYAC engineers' blog
    asiamoth
    asiamoth 2008/12/21
    jQuery といえど、まだまだブラウザ依存の問題が残っているのだな……。
  • jQuery の ID で対象ノードを取得する処理を高速にしたい - tilfin's note 跡地

    てっく煮ブログさんのエントリー jQuery を高速に使う CSS セレクタの書き方 - てっく煮ブログ をみてて、jQuery の $("#xxxx") を速くしたいと考えていたことを思いだした。それについて書く。 jQuery の $("#xxxx") について セレクタをどう処理しているのか jquery-1.2.6.js で確認してみよう。 まず下記の init が $() に相当する。Handle HTML stringsのところで引数が string だと quickExpr.exec が走る。これは正規表現でのセレクタ解析処理である。 その後、HANDLE: $("#id")のところでマッチして取得した ID を使って、var elem = document.getElementById 使い、それを return jQuery(elem) として再び init が呼び出され

    jQuery の ID で対象ノードを取得する処理を高速にしたい - tilfin's note 跡地
    asiamoth
    asiamoth 2008/12/16
    次期 jQuery では高速化されているのだろうか?
  • jQuery を高速に使う CSS セレクタの書き方 - てっく煮ブログ

    JavaScriptjQuery は CSS セレクタで要素を選んで処理できるのが魅力的ですね。そんな jQuery ですが、CSS セレクタの書き方次第で速度が大幅に変わってきます。ここでは jQuery の内部処理を疑似コードで示しつつ、jQuery を高速に使うためのポイントを5つに絞って紹介します。何度も同じセレクタを実行しないクラスだけを指定するのは禁止#id を積極的に使う途中までの結果を再利用する子供セレクタ(>)を使うと速くなることがある※ この記事は jQuery 1.2.6 のソースコードを元に記述しています1. 何度も同じセレクタを実行しない改善前 // 例題 1 $("div.foo").addClass("bar"); $("div.foo").css("background", "#ffffff"); $("div.foo").click(function(){

    asiamoth
    asiamoth 2008/12/14
    ほとんど知っているつもりだったが、子どもセレクタは見逃していた。たしか、CSS だと逆に遅くなるんじゃなかったかな。
  • Code Tutorials | Envato Tuts+

    All-in-one creative subscription with full AI stack All-in-one creative subscription From $16.50/m

    Code Tutorials | Envato Tuts+
    asiamoth
    asiamoth 2008/12/05
    iGoogle 風の UI を提供する。jQueryUI を使っているらしい。
  • Jeditable - Edit In Place Plugin For jQuery

    Inplace editing for jQuery. Currently unmaintained. Interested in becoming a web developer? Start with JavaScript Essentials (free) and continue to earn a full Techdegree (free trial). Hi! My name is Jeditable and I am inplace editor plugin for jQuery. With few lines of JavaScript code I allow you to click and edit the content of different html elements. I am based on Dylan Verheul's editable. For

    asiamoth
    asiamoth 2008/12/03
    jQuery でインライン編集(その場で文字入力)を実現するプラグイン。Flickr みたいな UI を簡単に作れる。
  • bizcaz.com

    asiamoth
    asiamoth 2008/12/02
    ツリービューは いくつもあるけど、これは使い勝手が良さそう。いつもながら丁寧な解説で参考にしやすい!
  • jQuery の配列系のメソッドをメモ - てっく煮ブログ

    JavaScriptjQuery は機能が豊富なので、しばらく使わないと忘れてしまう。ここでは、jQuery と配列の関係に絞って目的別に逆引きできるようにしておく。配列から jQuery オブジェクトを作成$ 関数に渡せばOK $([1,2,3]) NodeList のような配列っぽいものを渡しても解釈してくれる。 $(document.getElementsByTagName("div")) // $("div") と同じ ※内部的には setArray メソッドが呼ばれてるが、外から使うことは稀。jQuery を配列のように扱う要素数を取得するlength プロパティを使えばOK。 $("div").length // document.getElementsByTagName("div").length と同じ jQuery のメソッドを使って操作する限りは、適切に length

    asiamoth
    asiamoth 2008/11/28
    get や map など、知らないと損するな。覚えよう。
  • jQuery.brbr Pluginを作成しました。 - KAYAC Engineers' Blog

    高知から帰ったら席がのっとられていたagoです。 このたび弊社ではYUREX™ - ビンボーゆすりを科学したコラボ・プロダクトを開発として、YUREX製品サイトをOPENしました。 今回はこのサイトで使用している、文字や画像のリンク部分を揺らすjavascriptをjQuery.brbrとして(無駄に)jQuery Plugin化したので公開したいと思います。 使い方はjQueryと一緒に読み込み、揺らしたいelementsに対して.brbr()を指定するだけ。 $(function () { $(/* or selector */).brbr(); }); これで該当要素以下のリンクをカーソルで指定した場合にゆれるようになります。 指定できるパラメータと初期値は以下の通りです。 $(/* or selector */).brbr({ /* ゆれる方向を指定。 top,left,''を指定

    jQuery.brbr Pluginを作成しました。 - KAYAC Engineers' Blog
    asiamoth
    asiamoth 2008/11/28
    文字や画像がガクブルする。ちょいウザだけど楽しい。
  • Serie3 - Workshops

    ABOUT The s3Slider jQuery plugin is made by example of jd`s smooth slide show script. I needed something like that for jQuery (for my web site kruskica.net). Since i didnt find it after a small research i decided to build it by my self. Demonstration HOW TO USE It is very easy. First include the jQuery library then include the s3Slider javascript in the head of the page(s) where you want to use s3

    asiamoth
    asiamoth 2008/11/28
    画像の上にキャプションをかぶせて表示する。いままでは Flash がやってきたことも jQuery に任せられるな。というか、そうしてほしい。
  • HOKYPOKY. | MULTICOL. jQuery Plugin

    MULTICOL. はHTMLで雑誌のような美しい段組みレイアウトを実現するだけのシンプルなjQueryプラグインです。 もちろん、日製のプラグインなので日語もきれいに段組みにします。 一 或春の日暮です。 唐の西の門の下に、ぼんやり空を仰いでいる、一人の若者がありました。 若者は名を杜子春といって、元は金持の息子でしたが、今は財産を費な身分になっているのです。 何しろその頃洛陽といえば、天下に並ぶもののない、繁昌は、まるで画のような美しさです。 しかし杜子春は相変らず、門の壁に身を凭かと思う程、かすかに白く浮んでいるのです。 「日は暮れるし、腹は減るし、その上もうどこへ行っても、泊めてくれる所はなさそうだし——こんな思いをして生きている位なら、一そ川へでも身を投げて、死んでしまった方がましかも知れない」 杜子春はひとりさっきから、こんな取りとめもないことを思いめぐらしてい

    asiamoth
    asiamoth 2008/11/26
    マルチカラムはこれからの主流になるのだろうか?/ Jintrick さんのスクリプトとどちらが使いやすいか、検討しよう。