jQueryで要素数を取得する方法のまとめ
jQueryで要素数を数える方法のまとめです。 ここではul要素の子要素li要素の数を数えるサンプルを使って、いくつかの方法を紹介します。 size()メソッドは1.8から非推奨という指摘を頂いたので削除します。失礼致しました。 １．size()メソッドで数える まず、size()メソッドを使って要素数を数える方法です。 <script src="https://code.jquery.com/jquery-2.1.1.min.js"></script> <script> $(function() { var size = $('li').size(); alert(size); }); </script> <ul> <li>aaa</li> <li>bbb</li> <li>ccc</li> <li>ddd</li> <li>eee</li> </ul> ２．lengthプロパティで数え
jQueryでCSSのimportantを指定する方法
jQueryでCSSのimportantを指定する方法を紹介します。 １．問題点 jQueryでCSSの設定を行う場合、css()を利用します。 <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> <script> $(function(){ $('.foo').css('color', '#f00'); }); </script> <p class="foo">Hello!</p> ただし、importantを指定するときに次のように記述しても有効になりません。 <script> $(function(){ $('.foo').css('color', '#f00!important'); }); </script> ２．jQueryでCSSのimportantを指
jQuery UI Tabsのタブ切替でブラウザの「戻る」「進む」を有効にする方法
jQuery UI Tabsのタブ切替でブラウザの「戻る」「進む」を有効にする方法を紹介します。 １．jQuery UI Tabsについて 基本情報として、jQuery UI Tabsでタブ切り替えを行う方法については「jQuery UI Tabsを使ってタブを実装する」を参照してください。 サンプル ２．hashchangeプラグインについて jQuery UI Tabsのタブ切替でブラウザの「戻る」「進む」を有効にするには、hashchangeプラグインを利用します。 hashchangeプラグインの基本的な設定方法については「jQueryのAjaxやタブ切替などでブラウザの「戻る」「進む」が有効になる「hashchangeプラグイン」（実装解説つき）」を参照してください。 ３．jQuery UI Tabsでhashchangeプラグインを利用する ２項のリンク先の説明ではjQuery
jQueryでcookieを簡単に使える「jQuery Cookie」のまとめ
jQueryでcookieを簡単に使える「jQuery Cookie」の利用方法のまとめです。 １．機能 名前のとおり、「jQuery Cookie」はjQueryでcookieを簡単に使うためのjQueryプラグインです。 JavaScriptでは値のエンコード・デコードやpathやexpireの結合、取得時の操作など、cookie処理が結構面倒なのですが、このプラグインを利用すれば簡単に扱えるようになります。 ２．プラグインのダウンロード githubの「jquery-cookie」のページにある「ZIP」をクリック。 これでアーカイブをダウンロードできます。 ３．基本的な使い方 jQueryと、ダウンロードしたアーカイブに含まれるjquery.cookie.jsを読み込みます。 <script src="http://ajax.googleapis.com/ajax/libs/jqu
jQueryで遅延ロードを汎用的に実現する「ScrollTrigger」プラグイン
jQueryで遅延ロード（遅延読み込み）を汎用的に実現する「ScrollTrigger」プラグインを紹介します。スクロールで要素が表示されたときに任意の関数を実行できます。 当ブログでも、記事ページ本文下にあるソーシャルブックマークボタンとFacebookのLikeBoxの表示にこの仕組みを使っています。 １．目的 Facebookの「いいね！」ボタンなど、最近ソーシャル系のパーツをブログなどに表示している方が少なくないと思います。 ですが、パーツの表示にはJavaScriptを使っているものがほとんどで、そのまま設置するとページのロード時間が遅くなるケースが多く、結果的にページ表示時間に影響することになります。 本プラグインは、そういったソーシャル系のJavaScriptのロードを遅延させることができ、初回のロード時間を短縮したいときに効果があります。 ２．機能 ページをスクロールして、
HTMLの整形やJavaScriptの難読化を解除する「jsbeautifier.org」
HTMLの整形やJavaScriptの難読化を解除する「jsbeautifier.org」を紹介します。 JavaScriptの難読化解除には「JsDecoder」を利用していましたが、いつのまにか「Not Found」になってしまってました。 JsDecoder ということで代わりのサイトを探したところ、「Online JavaScript beautifier」を見つけました。 Online JavaScript beautifier 使い方は簡単で、整形したいコードをはりつけて、ページ上にある「Beautify JavaScript or HTML」をクリックするだけです。サンプルコードが表示されているのでクリックすれば整形されることが分かります。 jQueryで試してみます。下は整形前のものです。 いい感じに整形されました。 次にHTMLで試してみます。下は整形前のものです。 こち
CSS で table に斜線を引く方法
CSS で table に斜線を引いてみました。下の表の左上の斜線に CSS を使ってます。 サンプル（クリックすればサンプルページに移動します） Windows XP + IE6 / IE7 / Firefox3 / Safri3 / Google Chrome で確認しています。 ポイントは以下です。 th 要素に position: relative; 斜線を引く要素（ここでは span）に position: absolute; を設定。 斜線（border）を適用する要素の前に を設定。 がなかったり、要素の後方に があると、th のスタイルが隠れてしまう。 クロスブラウザにするため、font-size や line-height など、いくつかのプロパティを設定。 HTML <table summary="data"> <thead> <t
小粋空間: Movable Type プラグイン一覧
Movable Type 日本語環境でよく利用されていると思われる MovableType プラグインの一覧です。 海外サイトについては Googleで「Movable プラグイン」で検索した結果より、国内サイトは私が把握しているプラグイン作成者のサイトと Google 検索結果から抽出しています。Movable Type Plugins Directory からの抽出は行っていません。 また国内サイトのプラグインの概要は、配布サイトに掲載されている文言を引用させて頂いてます。 2010.05.01 MT5版のプラグイン一覧を公開しました。 2007.09.10 MT4版のプラグイン一覧を公開しました。本エントリーでのMT4版のプラグイン情報追加は終了します。 注意事項 プラグインに関するコメント等の主観的要素は含まないようにしています。プラグインの適用についてはご自身の判断で行ってくださ
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
