jQuery の書き方メモ

miniturbo 先生にテンプレートでけたよ!とご報告したところ、早速厳しいチェックが入りました。
彼は、私が初めて jQuery を触ってよろこんでいたときにステキなお祝いをくれた方です。

for( ; ; ){alert('Hello world !')}

それと nic 先生から聞いた話をメモ。

最初に自分で書いたもの

$('#navigation').hide()
	.css('position', 'fixed')
	.css('right', '0')
	.css('bottom', '0')
	.css('width', '0')
	.css('height', '85px'); (以下略)

同じ #navigation に対する指定だから省略して書けることを知って満足していました。

miniturbo 先生の指摘を受けて直したもの

$('#navigation').hide()
	.css({
		position: 'fixed',
		right: '0',
		bottom: '0',
		width: '0',
		height: '85px'
	}); (以下略)

先生曰く、「たぶん.css()を何回も読み出すよりオブジェクトで一気に渡した方がちょっとだけはやいと思う」とのこと。
オブジェクトってのは {} のことですってよ。
見た目もより CSS っぽくなって、書きやすいし読みやすいヽ(・ω・)ノ

こっそり白状すると functions.php の半分は miniturbo 先生謹製のハックでできています。
そのうち解読して自分用に書き直してみたい!そのためには正規表現を覚えないとだな(´・ω・`)

toggle は便利だけど・・・

nic 先生からもぽろっと、ためになりそうなお話をいただきました。
今回のコードは toggle を使って、右下の ! 部分( p.naviOpen )をクリックする度に処理が切り替わるようになっているのですが、クリックした回数分実行されるので連打するとガクガクプルプルしてしまいます。(よい子は試してみちゃダメ!)

$('p.naviOpen').click(function(){
	if($(this).css('display') == 'block'){

例えば上記のようにしたら表示されているときか・表示されていないときか指定することができるので、toggle はお手軽だけど場合によっては別の方法がいいかもしれないねー、とのこと。
ちなみに nic 先生のところは click でやってるので、高橋名人もびっくりな連射をしても大丈夫でした。
このうにょ?んに憧れて jQuery を覚えたんだよなー。

それと nic 先生の提案でナビゲーション部分を半透明にしてみましたヽ(・ω・)ノ

「jQuery の書き方メモ」への2件のフィードバック

  1.  こんにちは。
     jQueryは便利で面白いですよね。
     いろいろとプログラミングされているのですか?
     またスクリプトよろしくお願いいたします。

  2. こんにちはヽ(・ω・)ノ

    > いろいろとプログラミングされているのですか?
    プログラミングなどめっそうもございません。
    できたら楽しいだろうなーとわくわくしているところです!

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です