0

したがって、ユーザーが div をクリックすると、他の div の色が変わります。そのために私は持っています：

CSS

 .div1, .div2{ background: blue; }
    .div1:active + .div2 { background: red; }

HTML

<div class="div1">Some text</div>
<div class="div2">Other text</div>

これにより、ユーザーが div1 をクリックすると、div2 は背景を変更しますが、ユーザーがまだマウスを押している場合のみです。

:visitedユーザーが div1 を 1 回クリックすると、div1 の色が変更されたままになるプロパティのようなものを作成したいと考えています。

4

5 に答える 5

3

チェックボックスハックを使用できます

HTML:

<input type="checkbox" id="toggle">
<label for="toggle"><div class="div1">Some text</div></label>
<div class="div2">Other text</div>

CSS:

input[type=checkbox] {
   position: absolute;
   top: -9999px;
   left: -9999px;
}
.div1, .div2{
  background: blue;
  }
#toggle:checked ~ .div2{
  background: red;
 }

jsfiddle

于 2013-06-29T11:29:38.890 に答える
0

  1. マウス ボタンを押すには、これが必要です: http://api.jquery.com/mousedown/

  2. http://api.jquery.com/css/と一緒に必要なものを実現できます。

コードをjsfiddleに入れれば、私はそれを手伝うことができます。

于 2013-06-29T11:21:15.340 に答える
0

これを試して

<div class="div1"  onclick="style.backgroundColor = '#ff0000';" >some text</div>
<div class="div2">Other text</div>
于 2013-06-29T11:22:28.390 に答える
0

IE にこだわらない場合は、次のことができます。

http://jsfiddle.net/seemly/8NgpS/

HTML:

<div class="div1">Some text</div>
<div class="div2">Other text</div>

CSS:

div {
    width:200px;
    height:200px;
}
.div1 {
    background:#c00;
}
.div2 {
    background:#0c0;
}
.div1:active + div {
    background:#00c;
}
于 2013-06-29T13:23:12.633 に答える
0

この目的のためにjs関数を使用できます..

function change_color()
{
document.getElementById('change').className  = 'active';
}

CSS

.div{ background: blue; }
.active{ background: red; }

htnl

<div class="div" id="click" onclick="change_color()">Some text</div>
 <div class="div" id="change">Other text</div>
于 2013-06-29T11:30:25.010 に答える