0

我正在尝试制作一个基于选项卡的布局，如果它处于垂直方向，我可以让它工作，但我想让它们水平。单击选项卡时，我想进行div扩展，然后选项卡是，我遇到了麻烦。我还添加了一个X退出。这是我的jsFiddle。

<div id="header">
<div id="music"><a href="#">Music</a></div>             
<div id="about"><a href="#">About</a></div>
<div id="contact"><a href="#">Contact</a></div>
</div>

<div id="musicinfo">
<p>Music info div</p>
<p id='close'>x</p>
</div>

$("#music").click(function() {
$("#musicinfo").show();
$('#close').click(function() {
$("#musicinfo").hide();

});


});

我没有在我的小提琴上添加 jquery，所以这不是它不起作用的原因。所以我会改变我的问题，因为我认为这篇文章仍然会帮助人们。关于如何做我想要完成的事情有什么更好的想法吗？

4

2 回答 2

1

我可以建议一个不使用 jQuery 的更简单的解决方案吗？我真的不明白为什么每个人都想使用它，即使没有必要......（我假设你的问题是当你点击它的名字时如何让标签的内容出现）

http://jsfiddle.net/EPDqR/

<div id="header">
<div id="music" onclick="getElementById('musicinfo').style.display='block';"><a href="#">Music</a></div>             
<div id="about"><a href="#">About</a></div>
<div id="contact"><a href="#">Contact</a></div>
</div>

<div id="musicinfo">
<p>Music info div</p>
<p id='close' onclick="getElementById('musicinfo').style.display='none';">x</p>
</div>
于 2013-08-03T20:38:04.973 回答
1

您必须将 jQuery 导入小提琴

$("something")... // this is jQuery object

现在它可以工作了：http: //jsfiddle.net/FFjSk/23/

于 2013-08-03T20:38:17.337 回答