CSS滚动工作但链接不是

我一直在使用div构建我的第一个CSS网站，并且遇到按钮问题。虽然我可以让按钮在翻滚过程中工作，但链接不响应。有人可以请指教。谢谢。CSS滚动工作但链接不是

HTML：

<div class="wrapArrow"> 

<div class="arrow" style="cursor: pointer;"><a href="../index.html" title="home" target="_self"><span>home</span></a></div> 

</div><!-- END wrapArrow -->

CSS：

.wrapArrow { 
margin: 70px 0 0 0; 
padding: 0; 
width: 20px; 
height: 20px; 
float: right; 
} 


.arrow { 
display: block; 
width: 20px; 
height: 20px; 
background-image: url(../images/nav/arrows.gif); 
background-repeat: no-repeat; 

} 


.arrow:hover { 
    background-position: 0 -20px; } 


.arrow span { 
display: none; }

来源

2012-03-22 user862307

由于您的<span>不显示，你的链接没有任何内容，所以它被坍塌的宽度和高度为0，从而使其无法点击。

为什么不让锚点本身具有arrow类？

<div class="wrapArrow"> 

<a href="../index.html" title="home" target="_self" class="arrow" style="cursor: pointer;"><span>home</span></a> 

</div><!-- END wrapArrow -->

来源

2012-03-22 03:23:07 animuson

谢谢。这有点奇怪，但是我第一次点击就有效。然后，当我点击回来尝试再次不起作用。为什么会发生？ – user862307 2012-03-22 12:00:16

我仍试图解决这个问题，并将非常感谢一些帮助解决问题。如前所述，我尝试了上面的建议，但没有取得全面成功。尽管点击现在可以在第一次加载页面时运行，但如果我返回到页面，则不起作用。翻转效果完美运行，这是导致问题的点击。为什么会发生这种情况，我该如何解决？谢谢您的帮助。 – user862307 2012-03-27 20:54:39

@ user862307：当你说点击：你点击链接，然后是什么;使用后退箭头返回上一页？我想不出任何会导致链接在返回页面时变得无法点击的事情。 – animuson 2012-03-27 20:59:22

它看起来像你需要摆脱

.arrow span { 
    display: none; 
}

是否有需要存在的原因吗？如果显示设置为无，您将隐藏链接工作所必需的可点击元素。

来源

2012-03-22 03:21:04 knock

这没有奏效。没有跨度，文本会出现在背景图像上。该文本作为链接工作，但我不想看到它。 – user862307 2012-03-22 12:01:43

.arrow a是0 x 0 px

使得它真的很难点击。相信我，我尝试过。

尝试：

 .arrow a { 
      width: 100%; 
      height: 100%; 
      display: block; 
     }

来源

2012-03-22 03:21:35 max

谢谢。这也像上面的答案一样工作。我第一次点击工作。然后，当我点击回来尝试再次不起作用。很奇怪。 – user862307 2012-03-22 12:02:24

CSS滚动工作但链接不是

回答

相关问题