仕事と子供3人の子育てをしながら、短時間でできる料理とつくばの身近な情報・お役立ち情報を発信します
2011-05-20 (金) | 編集 |
20 Top jQuery tips & tricks for jQuery programmers

jQueryのパフォーマンスにおいて厳守すべき11の掟

ブログランキング・にほんブログ村へ
プラチナレポーター
2011-02-20 (日) | 編集 |
jqueryは便利ですが、今一つ使い方がピンと来ていないので覚書です。

<div id="jobPickUpHome" class="entryFrame">
<div class="entryTop">-</div>
<div class="entryBody">
<div class="jobHome">
<div class="entryTitle">
<h3>テスト1</h3>
</div>
<dl>
<dt>テストタイトル1</dt>
<dd>
テスト1の内容
</dd>
</dl>
</div>
<div class="jobHome jobHomeRight">
<div class="entryTitle">
<h3>テスト2</h3>
</div>
<dl>
<dt>テストタイトル2</dt>
<dd>
テスト2の内容
</dd>
</dl>
</div>
</div>
<div class="entryBody">
<div class="jobHome">
<div class="entryTitle">
<h3>テスト3</h3>
</div>
<dl>
<dt>テストタイトル3</dt>
<dd>
テスト3の内容
</dd>
</dl>
</div>
<div class="jobHome jobHomeRight">
<div class="entryTitle">
<h3>テスト4</h3>
</div>
<dl>
<dt>テストタイトル4</dt>
<dd>
テスト4の内容
</dd>
</dl>
</div>
</div>
<div class="entryBody">
<div class="jobHome">
<div class="entryTitle">
<h3>テスト5</h3>
</div>
<dl>
<dt>テストタイトル5</dt>
<dd>
テスト5の内容
</dd>
</dl>
</div>
<div class="jobHome jobHomeRight">
<div class="entryTitle">
<h3>テスト6</h3>
</div>
<dl>
<dt>テストタイトル6</dt>
<dd>
テスト6の内容
</dd>
</dl>
</div>
</div>
<div class="entryBottom">-</div>
</div>

というhtmlをシャッフルして表示する場合を考えます。

jquery.shuffle.jsに以下を追加します。

ブログランキング・にほんブログ村へ
プラチナレポーター