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

実家に帰ったら犬に威嚇されました。agoです。 jQuery Pluginに関しては、以前jQuery Pluginの書き方として基本的な部分をまとめたのですが、もう少し細かい部分に関して再度まとめてみようと思います。 1 $.dataの活用 以前jQuery.dataの使い方でも紹介したのですが、Pluginからelementを処理する場合対象のelementが広範囲に及ぶことが多く、Plugin内の変数の他に各element毎の変数を持ちたくなることがあります。 たとえば、「クリックする毎に順番にCSSが変わるPlugin」を考えた場合、各element毎に「今どのCSSが指定されているか」を保持できると実装が楽になると思います。 具体的には以下のような形になります。 $(function () { var colors = ['blue', 'yellow', 'red']; $('
と言っても、前々から作っているセレクタ関数が依存無しで簡単に切り出せそうだったから、切り出しただけです。 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 でテキストエリア内の文字はどのメソッドで取得する?」と、ちょっと疑問に思ったので実験した備忘録です。 jQuery では、指定した要素の中の文字列は「 .text() 」、指定した要素の中のHTML は「 .html() 」で取得できます。また、input 要素( type="text" )の value については「 .val() 」で取得できます。 さて、では textarea 要素の中の文字列については、上記のすべてのメソッドで取得できそうなのですが、実際のところどうなの?というのが今回の疑問です。 問題 ここにテキストエリアとボタンが一つずつあります。 テキストエリアの初期値は「かたつむりくん」です。ボタンをクリックすると、「 .text() 」「 .html() 」「 .val() 」の三つのメソッドでテキストエリア内の文字列を取得し、下の定義リストの項目名の下の
ソースコードをハイライト表示してくれる JavaScript ライブラリは数多くありますが、今回、このブログに google-code-prettify というライブラリを導入してみました。 少し前までは dp.SyntaxHighlighter(ソースコードをカラフルに読みやすくする - dp.SyntaxHighlighter )を使っていましたが、どうもイマイチ好きになれなかったので使用をやめていましたので、久しぶりのハイライト表示です。 google-code-prettify については、導入方法も含めて「【ハウツー】ハイライトもGoogle流 - "google-code-prettify"でソースコードに色付けを | マイコミジャーナル」で分かりやすく説明されていますので、ここでは jQuery を使っている環境下で、ブログ記事内のソースに一切手を加えない導入方法を紹介します
jQuery でファイルをインクルードする ( jQuery によるモジュール化) 通常のスタティックな Web サイトにおいて、Web ページの中で更新頻度の高いパーツを別ファイルにして、それをインクルードするシーンは多々あるかと思います。 Movable Type でも、モジュールやウィジェットを「インデックステンプレートのコンテキストで全ページに表示させたい」なんてとき、インデックステンプレートに読み込み用のファイルを作って、それを MTInclude で読み込むという手法... 通常のスタティックな Web サイトにおいて、Web ページの中で更新頻度の高いパーツを別ファイルにして、それをインクルードするシーンは多々あるかと思います。 Movable Type でも、モジュールやウィジェットを「インデックステンプレートのコンテキストで全ページに表示させたい」なんてとき、インデックス
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本体ではブラウザテ
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> 直接読み込むことも出来ます。
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 を高速に使う 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 が呼び出され
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(){
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
JavaScriptjQuery は機能が豊富なので、しばらく使わないと忘れてしまう。ここでは、jQuery と配列の関係に絞って目的別に逆引きできるようにしておく。配列から jQuery オブジェクトを作成$ 関数に渡せばOK $([1,2,3]) NodeList のような配列っぽいものを渡しても解釈してくれる。 $(document.getElementsByTagName("div")) // $("div") と同じ ※内部的には setArray メソッドが呼ばれてるが、外から使うことは稀。jQuery を配列のように扱う要素数を取得するlength プロパティを使えばOK。 $("div").length // document.getElementsByTagName("div").length と同じ jQuery のメソッドを使って操作する限りは、適切に length
高知から帰ったら席がのっとられていたagoです。 このたび弊社ではYUREX™ - ビンボーゆすりを科学したコラボ・プロダクトを開発として、YUREX製品サイトをOPENしました。 今回はこのサイトで使用している、文字や画像のリンク部分を揺らすjavascriptをjQuery.brbrとして(無駄に)jQuery Plugin化したので公開したいと思います。 使い方はjQueryと一緒に読み込み、揺らしたいelementsに対して.brbr()を指定するだけ。 $(function () { $(/* or selector */).brbr(); }); これで該当要素以下のリンクをカーソルで指定した場合にゆれるようになります。 指定できるパラメータと初期値は以下の通りです。 $(/* or selector */).brbr({ /* ゆれる方向を指定。 top,left,''を指定
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
MULTICOL. はHTMLで雑誌のような美しい段組みレイアウトを実現するだけのシンプルなjQueryプラグインです。 もちろん、日本製のプラグインなので日本語もきれいに段組みにします。 一 或春の日暮です。 唐の西の門の下に、ぼんやり空を仰いでいる、一人の若者がありました。 若者は名を杜子春といって、元は金持の息子でしたが、今は財産を費な身分になっているのです。 何しろその頃洛陽といえば、天下に並ぶもののない、繁昌は、まるで画のような美しさです。 しかし杜子春は相変らず、門の壁に身を凭かと思う程、かすかに白く浮んでいるのです。 「日は暮れるし、腹は減るし、その上もうどこへ行っても、泊めてくれる所はなさそうだし——こんな思いをして生きている位なら、一そ川へでも身を投げて、死んでしまった方がましかも知れない」 杜子春はひとりさっきから、こんな取りとめもないことを思いめぐらしてい
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く