jQuery
【jQuery】アコーディオンメニュー
2014.03.05
できるだけ簡単にできるアコーディオンメニューをさがしていて
下記の記事を見つけました。

jQuery アコーディオンメニュー
http://php.o0o0.jp/article/4138817358715040

もーすばらしく簡単で便利です。
デフォルトで空けておきたい部分も指定できます。
自分で作ってみたサンプル


【javascript】
----------------------------------------------
$(function () {
  // デフォルト開く部分を指定
  $('ul').eq(0).show();
  $('span').click(function() {
    // メニュー表示/非表示
    $(this).next('ul').slideToggle('fast');
  });
});


【CSS】
----------------------------------------------
ul {
  display: none;
}
span {
  cursor: pointer;
}


【HTML】
----------------------------------------------
<span>メニュー 1</span>
<ul>
<li><a href="#">メニュー 1-1</a></li>
<li><a href="#">メニュー 1-2</a></li>
<li><a href="#">メニュー 1-3</a></li>
</ul>
<span>メニュー 2</span>
<ul>
<li><a href="#">メニュー 2-1</a></li>
<li><a href="#">メニュー 2-2</a></li>
<li><a href="#">メニュー 2-3</a></li>
</ul>
<span>メニュー 3</span>
<ul>
<li><a href="#">メニュー 3-1</a></li>
<li><a href="#">メニュー 3-2</a></li>
<li><a href="#">メニュー 3-3</a></li>
</ul>


| コメント(0)
jQuery:高速化テクニックまとめ
2013.01.08
製作用メモ。
jQuery/JavaScriptを高速化するための記述方法がまとめられています。
こういう、普段なかなか身に着けられない知識はとてもありがたい。

jQuery/JavaScriptの高速化テクニックまとめ
http://matome.naver.jp/odai/2134058372410380801

実践できていたのは1つ目と5つ目くらいでした。。
| コメント(0)
jQuery:get関数の戻り値を受け取る
2012.09.12
jQueryのget関数を使ってPHPをリクエストし、
結果を戻り値として受け取る・・だけだったのですが、
勘違いをしていてひどく苦戦したのでメモします。


JS側は

$.get("test.php", function(data){
   alert(data);
});


というように、
PHPを実行してその結果を受けて
コールバック関数で表示させるというものです。

で、肝心のPHP側ですが、
処理の結果を return で返そうとしていて・・
(そもそも関数内じゃないので return は無意味ですね)

戻り値は XMLHttpRequestオブジェクトなので、
単純に print で出力してあげれば受け取ることができました。
| コメント(0)
マウスオーバーや画像表示の工夫
2012.08.29
コーディングをする際にできるちょっとした工夫をメモ。

■マウスオーバー
画像をふわっとオーバーします。

jQueryで簡単実装!フェードエフェクト付き画像ロールオーバー

サンプル


■マウスオーバー
背景色をふわっとオーバーします。

[jQuery] メニューの背景色をロールオーバーでふわっと変える

サンプル


■画像の表示
ふわっと表示させられます。

画像に遅延表示っぽいエフェクトを与えるだけのm5LazyDisplay

サンプル


| コメント(0)

月別アーカイブ