[jQuery]マウスイベントで「this」を自由に変更したい。jQuery.proxy()の使いどころ

Posted 2012年3月24日 | Auther dada | Category PC・デジタル | Tag タグ: ,
Twitterにツイートする Facebookでシェアする はてなブックマーク

ちょっとハマったのでメモ。
分かってしまえば非常に単純な話なんだけど、たぶん多くの人がハマるんじゃないかなというポイントをまとめてみました。

元ネタはこちらになります。
》jQuery1.4から追加されたjQuery.proxy()を試してみる | THE HAM MEDIA BLOG

jQueryを使って click()、hover()などのイベントを扱う時、多くのサンプルコードではこんな感じに書いてますよね。

$('.button').click(
  function(){
    alert( this.id );
  }
);

大抵のものはこのままでも問題ないのですが、クラスやオブジェクト内の関数を扱いたい時にちょっと困ったことになります。

続きを読む

[jQuery]個別の画像をラジオボタンやチェックボックスにするプラグイン

Posted 2012年1月30日 | Auther dada | Category PC・デジタル | Tag タグ: ,
Twitterにツイートする Facebookでシェアする はてなブックマーク

キャラクター人気投票で画像自体をフォームのラジオボタンやチェックボックスに
使いたかったので作りました。

<label>内に画像を置けばボタン代わりに出来るんですが、
選択状態によって画像を切り替えたかったのと、
IEだけ<label>内の画像に反応しないという、いつものアレな仕様もあったので……。

》jQuery.sygImageRadio
》デモページ

画像をラジオボタンやチェックボックスの代わりにすることで
デザインの自由度が上がるのと、入力状態がわかるのでユーザーの利便性が上がります。

詳しい使い方などはGitHubの配布ページでどうぞ。
》jQuery.sygImageRadio

[jQuery]スクロール対象の幅が可変なカルーセルプラグイン

Posted 2012年1月28日 | Auther dada | Category PC・デジタル | Tag タグ: ,
Twitterにツイートする Facebookでシェアする はてなブックマーク

複数の画像などをスクロールさせるのを「カルーセル」と言いますが
いざ使おうとしたら自分の求める仕様のものがなかったので(探すの面倒だったし)
作ってしまいました。

》jquery.syg_carousel
》デモページ

  • スクロール対象の幅がバラバラでも大丈夫
  • スクロールするだけのシンプルさ

というのが特徴です。

詳しい使い方などはGitHubの配布ページでどうぞ。
》jquery.syg_carousel

githubで変更をプッシュできなくてハマった時の対処法

Posted 2012年1月27日 | Auther dada | Category PC・デジタル | Tag タグ: ,
Twitterにツイートする Facebookでシェアする はてなブックマーク

github使ってみようかなーと、自作の適当なjQueryプラグインをコミットしてみました。

jquery.syg_carousel
https://github.com/sygnas/jquery.syg_carousel
スクロールアイテムの幅が可変なカルーセルプラグインです。

で、アップデートをコミットしている時にハマってしまったので
その解決法をメモしておきます。

エラーはこんな感じ。
他で更新されたものと競合してるとかそんなですか?

To [email protected]:sygnas/jquery.syg_carousel.git
! [rejected] master-> master(non-fast forward)
error: failed to push some refs to [email protected]:sygnas/jquery.syg_carousel.git'
github 'Note about fast-forwards' section of 'git push --help' for details.

続きを読む

カテゴリー