CSS3的onclick激活另一个DIV的动画(CSS3 onclick activate anot

我有一个链接到我的锚页面上的菜单栏。 目前有哪些是动画中使用的初始页面加载CSS3褪色，但我想，而不是让他们在菜单栏中的某个锚链接被点击后淡出页面中的内容。 我怎么做？

例如。 关于按下然后.aboutinfo CSS动画被激活。

Answer 1:

这里是一个演示，有即使只有CSS（无JavaScript）的一个onclick http://jsfiddle.net/kevinPHPkevin/K8Hax/

CSS

#box1 {
    display:none;
}
#box1:target {
    display:block;
}

HTML

<a href="#box1">Click Me</a>
<div id="box1">test test</div>

Answer 2:

要做到这一点，您可以使用“+”符号

对于如。

如果我想圆的颜色，当我将鼠标悬停在一个框，然后改变

查看：

http://jsfiddle.net/utkarshd/Hh38R/

HTML

<div class="box"></div>
<div class="circle"></div>

CSS

.box{width:100px; height:100px; background-color:yellow;} 

.circle{
width:100px;
height:100px;
border-radius:100px 100px;
background-color:orange;
-webkit-transition:all 0.7s;//for safari and chrome
-moz-transition:all 0.7s;//for mozilla
-o-transition:all 0.7s;//for opera
-ms-transition:all 0.7s;//for IE
}

.box:hover+.circle
{
background-color:blue;
}

文章来源: CSS3 onclick activate another DIV's animation