画像とテキストを表示/非表示するためのJqueryボタン

私はこのウェブサイトにjQueryのでこの2つのボタンを持っています.BT1をクリックすると画像が表示され、最初の画像をクリックします。このボタンbtn2の2番目のイメージが表示されます。画像とテキストを表示/非表示するためのJqueryボタン

問題は私はbtn1をクリックし、次にbtn2をクリックします。私はbtn1に戻ってそれをクリックすると動作しません。私はお互いをダブルクリックしてクリックして画像を開き、もう片方を閉じる必要があります。

画像を見るには一度クリックしてください.2番目のボタンをクリックすると、最初の画像が消えて2番目の画像が開きます。

ウェブサイトを開いたときにその画像が表示されますが、いずれかのボタン（btn1、btn2）をクリックすると画像の非表示が消えます。

**第三の画像ではないため（BTN1/BTN2）が、私は自分のWebを開くn iはbtnクラスを-DIVs与えるのを助ける

<html> 
<head> 

<script type="text/javascript"> 

function showhide_menu(id){ 
    $("#" + id).toggle(); 
} 

</script> 
</head> 
<body> 
<button onclick="showhide_menu('btn1');">Show/Hide. </button> 

<button onclick="showhide_menu('btn2');">Show/Hide. </button> 

<div id="btn1" style="display:none;"> 
    <img src="http://mybroadband.co.za/photos/data/500/apple-logo.jpg"/> 
    text text text text text text text text text....</div> 

<div id="btn2" style="display:none;"> 
    <img src="http://www.inquisitr.com/wp-content/2012/02/breaking-dawn-saga.jpg"/> 
    text text text text text text text text text....</div> 

</body> 
</html>

出典

2012-03-08 Ahmet agha

あなたの例はちょうど動作します：http://jsfiddle.net/2gsKq/1/ – bfavaretto

のために任意の画像感謝をクリックすると消えたときに表示されます。そして、トグルする前にそれらを隠す：

http://jsfiddle.net/qYCUJ/

HTML

<div id="btn1" class="btn" style="display:none;"> 
    <img src="http://mybroadband.co.za/photos/data/500/apple-logo.jpg"/> 
    text text text text text text text text text.... 
</div> 
<div id="btn2" class="btn" style="display:none;"> 
    <img src="http://www.inquisitr.com/wp-content/2012/02/breaking-dawn-saga.jpg"/> 
    text text text text text text text text text.... 
</div>

function showhide_menu(id){ 
    $('.btn:not(#'+id+')').hide(); 
    $("#" + id).toggle(); 
}

出典

2012-03-08 20:23:17 Alex

をあなたはあまりにもthis

を使用することができます3210

function showhide_menu(){ 
    if($('#btn1').is(':visible')) 
    { 
     $('#btn1').hide(); 
     $('#btn2').show(); 
    } 
    else 
    { 
     $('#btn2').hide(); 
     $('#btn1').show(); 
    } 
}

出典

2012-03-08 20:29:46

画像とテキストを表示/非表示するためのJqueryボタン

答えて

関連する問題