我在jsfiddle做了菜单,这是我的工作。
但我在页面上得到了不同的结果。
是jsfiddle工作吗? 我需要修改一些代码吗?
<div id="menu_main">
<ul>
<li class="mainop"><a href="#">Category</a>
<ul>
<li><a href='../index.php?category=Blogging'>Blogging</a></li>
<li><a href='../index.php?category=General'>General</a></li>
<li><a href='../index.php?category=Arts and Entertainment'>Arts and Entertainment</a></li>
<li><a href='../index.php?category=Womens Interests'>Womens Interests</a></li>
<li><a href='../index.php?category=Writing and Speaking'>Writing and Speaking</a></li>
</ul>
</li>
</ul>
</div>
我的剧本
<script language="JavaScript" type="text/javascript">
$(document).ready(function() {
$(".mainop").hover(function() {
var $this = $(this);
$this.find("ul").slideDown("fast");
$this.children('a:first-child').addClass('active');
}, function() {
var $this = $(this);
$this.find("ul").slideUp("fast");
$this.children('a:first-child').removeClass('active');
});
});
</script>
答案 0 :(得分:0)
根据JSFiddle,您的代码的输出HTML如下所示:
<div id="menu_main">
<ul>
<li class="mainop"><a href="#">Main option</a>
<ul style="display: block; "></ul>
</li>
<li class="mainop"><a href="#">Main option</a></li>
<li class="mainop"><a href="#">Main option</a></li>
</ul>
</div>
所有列表元素都消失了。
我可以看到你引用了columnizer jQuery plugin,但是你没有将它包含在你的JSFiddle页面中。这可能是你没有得到相同结果的原因。如果您删除了对columnize
的调用,则列表元素会重新出现,但看起来并不漂亮。