Question

我有一个链接到我页面上的锚点的菜单栏。目前，页面中的内容在初始页面加载时使用CSS3进行动画淡化，但我希望在菜单栏中的某个锚链接被点击后淡入其中。我该怎么做？

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

Answer 1

这是一个即使只使用CSS也没有onclick的演示（没有javascript）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激活另一个DIV的动画

2 个答案: