<div class="photo"><img src="../../../../resources/kaminari-mon.png" alt="東京駅" /></div>
 <div class="photo"><img src="../../../../resources/photo1.jpg" alt="東京ドーム" /></div>
 <div class="photo"><img src="../../../../resources/photo2.jpg" alt="恐竜型ロボット" /></div>

$(document).ready(function() {
     var photo=$('div.photo');   //画像の表示領域（<div class="photo">）
     photo.click(function(ev) {  //画像の表示領域がクリックされたらイベント開始
         $(this).fadeOut('2000',function() {      
         var next=$(this).next();
         next=(next.size() > 0)?    //次の画像は
               next:photo.eq(0);   //次の兄弟要素が先頭の要素
   next.fadeIn('2000');                 //次の画像（非表示）
  } );
} );
photo.eq(0).nextAll().hide();     //スタート時（アクセス直後）先頭以外の画像は非表示
} );