スクリプトの試し書きに便利なjsfidle

ちょこっと試し書き、公開したいときに便利なjsfidle。

radioボタンで開閉

radioボタンで切り替え


input要素は何となくchangeイベントを適用するもんだと思い込んでいたけど、tab切り替えと同様の仕様でいいことに気づく。

getメソッドの戻り値はDOM要素
eqメソッドの戻り値はjQueryオブジェクト(ラップ集合)

getメソッドを使う例
http://semooh.jp/jquery/api/internals/jQuery.data/elem,+name/
dataメソッドの第一引数がelem

ホバーでキャプション表示


・古いIEに対応する場合

filter: alpha(opacity=70);        /* ie 6 7 */
-ms-filter: "alpha(opacity=70)";  /* ie 8 */

・CSS3のanimationで書いたやつはこちら。
http://www.nxworld.net/tips/css-only-caption-effect.html

はじめはimg要素をhoverしたときに、キャプションを表示するので以下のように書いていたが

$('figure > img').hover( function () {
$(this).closest('figure').find('figcaption').animate({opacity:1,"fast");

figcaptionで完結してた。

スクロールで出現するスティッキーヘッダ

oneの部分のメソッドチェーンが参考になる。

onメソッドじゃなく以下でも同じ。
_window.scroll( function () { });

無限ループ表示のカルーセル

途中1

途中2

インターバルありのドロップダウンメニュー


(途中)

メガメニュー

スポンサーリンク
RESAD
RESAD

シェアする

  • このエントリーをはてなブックマークに追加

フォローする

スポンサーリンク
RESAD