WonderCSS

如何实现触发锚链接而隐藏一个DIV

今天在工作中要做个伪提示框,因此就需要在这个提示框内加一个关闭按钮,实现点击后隐藏掉这个<div>容器。经测试后记录下这个最简单的实现方法,因为是伪的嘛所以也就不苛求记录COOKIE,连JS也省了。只需要为锚链加上 onclick 就OK了!具体实例如下:


<div id="bulletin">
    <p>你已经无法再次作出评价!</p>
    <a style="cursor:pointer;" onclick="bulletin.style.display='none'">关闭</a>
</div>

在这里我们使用了 display=’none’ 而不是 visibility=’hidden’ 。因为 visibility=’hidden’ 是不去渲染,但是其本身的高度等元素仍在页面里占位,所以我们需要使用 display=’none’ 来彻底隐藏掉这个对象。

By 于湛 发布于 2013.05.31 5,606 次浏览

发表评论

电子邮件地址不会被公开。 必填项已用*标注