文本在悬停背景上淡入

Question

演示：http://jleblanc.pancakeapps.com/index.html

页面源中的所有html / css。

我正在为我妈做一个网站，我试图隐藏.one .two和.three div上的文字，直到鼠标悬停在它们上面。我也试图在悬停时使背景淡入rgba（0,0,0,0.6）。我也不是很熟悉javascript。有没有人知道如何做到这一点？

/编辑 - 我希望文本从后台淡入，对不起有困惑。 /

Answer 1

对于淡化文本，请执行以下操作：

.one section{
    transition: opacity 1s;
    height: 100%;
}
.one section:hover{
    opacity: 0;
}

为了淡化背景和文字，请尝试以下代码段：http://jsfiddle.net/dZMKt/

我根据你的代码做了一个简单的例子。你需要做的唯一改变 - 添加＆＃34; one_wrapper＆＃34;围绕＆＃34;一个＆＃34; -div。

详细了解css3-transitions

Answer 2

你不需要javascript。修改你的课程如下。

.one {
   text-indent:-9999px;
}


.one:hover {
   text-indent:0;
}