7月 15
jQueryを使って画像をいろいろ操作してみます。
7月 08
タイトル通り試してみたのでポスト。
7月 07
ちょっとはまったのでポスト。
jQueryのプラグインを使う際に気をつけなきゃいけないことなんですが、jQuery(function(){});でdocument読み込み完了後に処理させるようにするのはもちろんなんですが、プラグインによってはうまくCSSが当たらない等があります。
これはjQueryプラグインを読み込んだ後にCSSをあてがうと起こります。
例えば「jquery.bar.js」とかいうプラグインがあるものとして例を挙げてみます。
例えば以下のような場合。
1 2 3 4 5 6 7 8 | <script type="text/javascript" src="js/jquery-1.3.2-min.js"></script> <script type="text/javascript" src="js/foo/jquery.bar.js"></script> <link href="/css/bar.css" media="screen" rel="stylesheet" type="text/css" /> <script type="text.javascript"> jQuery(function(){ jQuery("#id").bar() ; }) ; </script> |
これはユーザーからみれば、ドキュメント読み込んでからCSS当たるんだもんね！って解釈になっているので本来なら「css読み込む→js読み込む→js実行される」と動いて欲しいところですが、これだと上から順番に実行されるのでうまくCSSが当たらない場合があります。
もし正しく動作させるならば、先ほどの読み込み順序は以下のようにならなければなりません。
1 2 3 4 5 6 7 8 | <link href="/css/bar.css" media="screen" rel="stylesheet" type="text/css" /> <script type="text/javascript" src="js/jquery-1.3.2-min.js"></script> <script type="text/javascript" src="js/foo/jquery.bar.js"></script> <script type="text/javascript"> jQuery(function(){ jQuery("#id").bar() ; }) ; </script> |
理由はとっても簡単。
上から順に実行されるから。
でも上から順に実行されるからって理由だけじゃ満足されない方もいるかもしれないので、もう少し詳しく。
プラグイン内部では、たいがい「each」という関数が使われています。
その中で、抽出されたHTML要素に対してCSSを当てたり、クリックされたら動いてね！等の関数をあてがうことが出来ます。
このせいで後からCSSを読み込ませたりすると、CSSでの表示崩れが起こる場合があると言うことなのです。
なので、jQueryプラグインを使う際はCSSとJSの読み込み順序に気をつけましょう。＆前に戻りまくる事も大切。というお話でした。
といっても、配布サイトに書いてあったりもするんですが・・・。
TasteRank
度合い*****(---)
6月 19
たまに管理画面内のログを見るのですが、以外とjQueryで数字カウントを検索している方がいらっしゃるみたいでしたので、勢いで作ってみました。
Continue reading »
TasteRank
度合い*****(---)
6月 15
作業しながら簡単につけられないだろうかなぁとおもってやってたら案外いけたのでさらしてみます。
1 2 3 4 5 6 7 | jQuery(function(){ jQuery("input:checkbox:first, input:checkbox:last").bind("click",function(){ jQuery("input:checkbox").not(this).each(function(){ this.checked = !this.checked ; }) ; }); }) ; |
自分はこれでやりましたが、「input:checkbox」としなくても「:checkbox」だけで動いてくれると思います。
もっと簡単にできる！のがありましたら教えていただければなぁと思います。。。
2.8にうｐｄａｔｅしたらプラグインと画像全部すっ飛びました。
TransmitってFTPでうｐしたので操作になれずアボンしました。
TasteRank
度合い*****(---)
12月 18
mprove your jQuery – 25 excellent tips
ｊQueryを利用する際の25のTipsを見つけたので紹介します。
ちょっと長いですが、かなりいいです。
Continue reading »
10月 29
ｊQueryのプラグインのjTweryを作ってみた。
ｊQueryからもじりましたごめんなさい。
：：追記：：08/10/29 早速バグを見つけたので、更新しました。
内容はJSONPでデータを受け取るはずが、JSONで受け取ろうとしていたため、URLにアクセスできず（クロスドメインのセキュリティがなんちゃら）にいました。データの受け取り期待値をJSONPへ変更し、対処しました。