2016-07-30 15 views
-1

私はこの作業を行う上でいくつかの問題を抱えていました.3つのイメージを他のイメージに変更するボタンと3つのイメージを持つhtmlページを作成する必要があります。最初から3つの画像に切り替わります。Jquery image change

+0

ようこそ。 Minimal、Complete、Verifiableの質問の作成方法の詳細については、[こちらを読む](http://stackoverflow.com/help/mcve)を参照してください。 – Toby

答えて

0

すべての画像を2つのdiv要素に読み込み、デフォルトでそれらの要素の1つを非表示にしてから、表示されているdivとボタンが押されたときに隠される要素を切り替えます。 jQueryのクリック機能は、ボタンがクリックされたときを検出し、jQueryのトグル機能は状態の表示/非表示を切り替えることができます。スタックオーバーフローへ

$(document).ready(function(){ 
 
\t $('#imageSet2').hide(); 
 
}) 
 

 
$('#imageSetBtn').click(function(){ 
 
\t $('#imageSet1').toggle(); 
 
\t $('#imageSet2').toggle(); 
 
})
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<button id="imageSetBtn" type="button">Switch</button> 
 

 
<div id="imageSet1"> 
 
\t <img src="https://www.google.com/chrome/assets/common/images/chrome_logo_2x.png?mmfb=a5234ae3c4265f687c7fffae2760a907"> 
 
</div> 
 

 
<div id="imageSet2"> 
 
\t <img src="https://www.mozilla.org/media/img/firefox/template/header-logo-inverse.510f97e92635.png"> 
 
</div>

+0

ありがとう、完璧に働いた。 – user6658486