Question

当我点击+图标然后显示另一个div时，我正在为一个网站制作手风琴。我正在使用jquery。但这可能在css中点击另一个元素打开一个div

Answer 1

严格使用CSS，这是不可能的。使用jQuery：

$("#idOfPlus").click(function() { 
  $("#myPlusDiv").show();
});

Answer 2

使用纯CSS无法实现。您可以选择任何JavaScript框架。

Answer 3

是的，可以使用focus伪类：

<html>
<head>
<style type="text/css">
#hidden { display: none; border: 2px solid green; cursor: default; }
a {text-decoration: none;}    /* unvisited link */
a, div:visited { color: blue; }
a:focus #hidden { color: black; display: block; }
</style>
</head>

<body>
<a href="#">Click to show box
<div id="hidden">More information!<br/>Click outside to remove</div>
</a>
</body>
</html>

即使这样做（有点）你想要它也不可用，因为你的盒子在链接中，因此可点击。当在框外点击时，它会关闭。所以，除非这对你来说不是问题，否则我不得不说这对我来说似乎不太可能......

（除非别人在使用CSS方面比我更好，并且可以想到更聪明的东西）

编辑：如果您找到另一个支持焦点伪类的HTML元素，那么它可能比使用<a>元素更好，就像我的例子一样。

Answer 4

您可以将图标设为指向自身或不指向任何内容的锚点（href="#"），然后使用:active来触发类更改。但唯一的问题是，一旦他们没有点击，它就会返回到非活动状态，所以你的手风琴会在打开时快速关闭，除非你有另一个规则来举行课程。

我们可以像css一样在css中制作onclick效果：悬停？

4 个答案: