使用 <a href="#nice"> 隐藏我的 div答案

【问题标题】：Hide my div using <a href="#nice">使用 <a href="#nice"> 隐藏我的 div
【发布时间】：2014-02-11 10:40:45
【问题描述】：

我正在做一个项目，我需要在单击 a x 时隐藏一个 div。我想针对要关闭的特定 div，即持有 href 的 div 很好。单击 X 后，我有点难以定位 div。能否给简单的设计师指点一下？

HTML

Div name = 页脚，链接类是“linky”

CSS

     .linky:link {
      footer:display: none;
      }

任何帮助将不胜感激。

问候，

【问题讨论】：

标签： css html visibility

【解决方案1】：

将链接目标直接放在页脚之前：

<body>
    <a href="#linky">hide footer</a>
    ... other content ...
    <div id="linky"></div>
    <footer>footer</footer>
</body>

使用+ 运算符：

#linky:target + footer {
    display: none;
}

/* to prevent scrolling to the bottom */
#linky {
    position: fixed;    
    top: 0;
}

see this fiddle

如果b 直接在a 之后，a + b 将定位到b。

请注意与您的版本的两个额外差异：

使用:target 而不是:link（:link 将定位链接）
使用id 代替class

我想补充一点，只要用户点击任何其他 #anchor 链接，页脚就会再次可见。

更新：现在阻止滚动；删除了简单版本，因为那里无法阻止滚动

【讨论】：

您好，感谢您的关注。我花了一点时间才注意到你的小提琴上的文字消失在底部。我不得不承认我现在对这个项目的处理方式有所不同，但感谢您的帮助，稍后会回来。

【解决方案2】：

试试这个：

<div id="div1">
    Hello, i will be hidden on click  the below link
</div>

<a href="" id="link" onClick="hide()"><b>Click here</b></a> to hide
## this is the link code
<a href="" id="link" onClick="hide()"><b>Click here</b> to hide
<script>
    function hide(){
        document.getElementById('div1').style.display="none";
    }
</script>

【讨论】：

您好，感谢您的帮助。那是javascript吗？我试过了，但什么也没发生……我也不明白为什么它不应该工作。