3

基本的に、純粋な css を使用してギャラリーを構築しています。image1 を押すと、checkbox1 がチェックされ、div1 が表示されます。問題は、image2 を押すと div2 が表示されますが、image1 をもう一度押すと、div2 が前にあるため div1 が表示されないことです。

HTML:

<div class="gallery">
<label for="toggle1"><a>1</a></label>
<input id="toggle1" type="checkbox">
<label for="toggle2"><a>2</a></label>
<input id="toggle2" type="checkbox">
<label for="toggle3"><a>3</a></label>
<input id="toggle3" type="checkbox">
<label for="toggle4"><a>4</a></label>
<input id="toggle4" type="checkbox">
<label for="toggle5"><a>5</a></label>
<input id="toggle5" type="checkbox">
<label for="toggle6"><a>6</a></label>
<input id="toggle6" type="checkbox">
<label for="toggle7"><a>7</a></label>
<input id="toggle7" type="checkbox">
<label for="toggle8"><a>8</a></label>
<input id="toggle8" type="checkbox">
<div class="conteudo1">1</div>
<div class="conteudo2">2</div>
<div class="conteudo3">3</div>
<div class="conteudo4">4</div>
<div class="conteudo5">5</div>
<div class="conteudo6">6</div>
<div class="conteudo7">7</div>
<div class="conteudo8">8</div>
</div>

コードを自動的にインデントする方法が見つからなかったため、css は投稿しませんが、ここで確認できます: http://jsfiddle.net/blackice856/3vhCH/1/

基本的に私が必要とするのは、チェックボックス1がチェックされ、他のすべてのチェックボックスのチェックを外し、残りのすべてのチェックボックスに対してそれを繰り返すことです。

私はJavaScriptがあまり好きではありませんでしたが、これを使って10分ほどかかりました笑、それでも何か方法があるかどうか知りたいです.

御時間ありがとうございます （：

4

1 に答える 1

0

はい。他のボックスのチェックを外すには、Javascript を記述する必要があります。mu が短すぎると言われているように、HTML 自体は実際にはラジオ ボックスで同様の機能を提供します。

于 2013-07-08T00:31:14.990 に答える