【jQuery入門】要素のイベント発生時の処理を指定する

$(function(){
  // IDがhogeの要素を取得し、クリックしたときの処理を指定
  $("#hoge").click(function(){
    // IDがfugaの要素を取得し、表示・非表示状態を切替する
    $("#fuga").toggle()
  })
});

$(function(){
  // IDがhogeの要素を取得し、ホバーしたときの処理を指定
  $("#hoge").hover(function(){
    // 要素内にカーソルが入った時
    $(this).css("background","red")
  },function(){
    // 要素内からカーソルが出た時
    $(this).css("background","white")
  })
});

$(function(){
  // windowを取得し、スクロールした時の処理を指定
  $(window).scroll(function (){
    // windowの上部からのスクロール量を取得して、変数stに入れる
	var st = $(window).scrollTop();
  })
});

$(document).ready(function(){
  // HTMLの読込が完了したら実行する処理を記述
});

$(function(){
  // HTMLの読込が完了したら実行する処理を記述
});

$(function(){
  $("#hoge").hover(function(){
    // ホバーイベントの発生したIDがhogeの要素の背景色を赤色に
    $(this).css("background","red")
  },function(){
    // ホバーイベントの発生したIDがhogeの要素の背景色を青色に
    $(this).css("background","white")
  })
});

// jQueryで記述したコードはコレで囲む
$(function(){

  // セレクタで指定した要素にイベントを指定する
  $(セレクタ).イベント(function(){

    // イベントの発生時にセレクタで取得した要素を操作する場合
    $(セレクタ).メソッド()

    // イベントの発生した要素自身を操作する場合
    $(this).メソッド()
  })

});