株式会社アイネックスはソフトウェアの開発、ホームページの作成ツール企業です。

　　　　　横浜、東京に拠点を置き、検証システム／金融・証券のシステム等の構築、開発を行い、
ホームページの作成ツール支援と多岐にわたるソリューションを提供します。

jQuery

21-05)　1. スライド画像選択を行う　　toggle()イベント

　

ボタン（画像を変更）をクリックする（toggle()）毎に、異なる画像を表示する

動作；　ボタン（#btn2105；画像を変更）をクリック（ .toggle(function()）するたびに、
　　　　　次の画像を切替て表示（,function()）する。

jQueryの書き方 /*------------------------------------ */
//21-05) ｸﾘｯｸ処理 toggle()
/*------------------------------------ */
$("#btn2105")
  .toggle(function(){
  $("img#img2105")     /*1回目のクリック：画像を表示 */
    .attr("src","../images/1.jpg")
    .attr("alt","海");
  }
  ,function(){　　　/*2回目のクリック：画像を表示 */
    $("img#img2105")
      .attr("src","../images/2.jpg")
      .attr("alt","くらげ");
    }
  ,function(){　　　/*3回目のクリック：画像を表示 */
    $("img#img2105")
      .attr("src","../images/3.jpg")
      .attr("alt","建物");
  }
  ,function(){　　　/*4回目のクリック：画像を表示　繰返し */
    $("img#img2105")
     .attr("src","../images/4.jpg")
    .attr("alt","花");
});
ｃｓｓの書き方 ----------
HTMLの書き方 <button id="btn2105">画像を変更</button>
<p class="marLft50">
  <img id="img2105" src="../images/5.jpg" alt="花" />
</p>



花