hanuman6
11/19/2013 - 5:44 AM

簡単ロールオーバー

簡単ロールオーバー

$.fn.rollover = function() {
   return this.each(function() {
      // 画像名を取得
      var src = $(this).attr('src');
      //すでに画像名に「_on.」が付いていた場合、ロールオーバー処理をしない
      if (src.match('_on.')) return;
      // ロールオーバー用の画像名を取得(_onを付加)
      var src_on = src.replace(/^(.+)(\.[a-z]+)$/, "$1_on$2");
      // 画像のプリロード(先読み込み)
      $('').attr('src', src_on);
      // ロールオーバー処理
      $(this).hover(
         function() { $(this).attr('src', src_on); },
         function() { $(this).attr('src', src); }
      );
   });
};
	//ロールオーバー
	$('#gNav img').rollover();
	$('.rollover').rollover();
	$('form input:image').rollover();