Question

我有一个div我想要显示为：target使用css。到目前为止这个工作正常。我的问题是：我希望它能够逐渐消失。

我的代码：

<div id="stuff">
Content
</div>

#stuff {
    opacity:0;
    transition: opacity .5s ease-in-out;
}

#stuff:target {
    opacity:1;
}

所以，让我们在下面的网址上说它应该淡入（它做什么）：

example.com/example.htm#stuff

但是当我将url更改为以下（或其他任何内容）时，它会在没有转换的情况下变得不可见：

example.com/example.htm＃

请注意，我想通过点击链接更改网址，而不是通过JavaScript修改网址。

我的问题是：

在不使用JavaScript的情况下更改上一个目标的目标时是否可以进行转换？你会如何实现它？

如果可能，我根本不想使用任何JavaScript。

Answer 1

我刚刚更改了opacity属性的值并且它正在运行。据我所知，opacity只接受0到1之间的小数值（inherit，initial和unset除外）。

＆＃13;

#stuff {
    opacity:0;
    transition: opacity .5s ease-in-out;
}

#stuff:target {
    opacity:1;
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="stuff">
Content
</div>
<a href="#stuff">Add hash</a>
<a href="#">Remove hash</a>

＆＃13;

淡出前一个：目标后：目标已更改

1 个答案: