1

Image_A と Image_B の 2 つの画像があります。また、ページの読み込み時に両方とも非表示になる Div_A と Div_B の 2 つの Div があります。

Image_A がクリックされた場合、Div_A を表示する必要があります。しかし、ig Image_B をクリックすると、Div_A を非表示にして Div_B を表示する必要があります。

これは他の方法でも機能するはずなので、画像がクリックされた場合に表示される div は 1 つだけです。

これは純粋なcssのみで達成できますか? または、Javascript/Jqueryでそれを行うとしたら???

ありがとう

4

3 に答える 3

1 
$('#img_1').on('click', function() {
  $('#div_1').show();
  $('#div_2').hide();
});

$('#img_2').on('click', function() {
  $('#div_1').hide();
  $('#div_2').show();
});
于 2012-06-01T04:07:34.093 に答える
0

css を次のように設定できます。

#img_1, #img_2{
visibility: hidden;
}

そしてあなたのJavaScriptで;

$('#img_1').click(function() {
  $('#div_1').css({"visibility":"visible"});
  $('#div_2').css({"visibility":"hidden"});
});

$('#img_2').click(function() {
  $('#div_2').css({"visibility":"visible"});
  $('#div_1').css({"visibility":"hidden"});
});

これが動作するデモです。

于 2012-06-01T04:16:41.167 に答える
0

イベントハンドラーを各画像に配置し、呼び出された関数のdivの可視性を変更することにより、JavascriptまたはJqueryで実行できます。

純粋なcssでそれを行うかどうかはわかりません。

于 2012-06-01T04:08:11.697 に答える