[英]How to use jQueryUI accordion with a custom header and content div?
I've got some divs which I want to animate like an accordion, for which obviously the most logical way of doing it is the jQueryUI accordion . 我有一些div,我想像手风琴一样动画,显然最合乎逻辑的方法是使用jQueryUI手风琴 。 But since I don't want to use the usual
<h3>
tags as headers I use custom headers as described here . 但由于我不想使用通常的
<h3>
标签作为标头,我使用自定义标头,如此处所述 。 The code I have now is as follows: 我现在的代码如下:
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script>
<script src="https://code.jquery.com/ui/1.11.2/jquery-ui.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$(function(){
$("#ticket-event-list").accordion({
header: 'event'
});
});
});
</script>
</head>
<body>
<div id="ticket-event-list">
<div class="event" id="event1">First event</div>
<div class="content">The content</div>
<div class="event" id="event2">Second event</div>
<div class="content">The other content</div>
</div>
</body>
</html>
This however, doesn't do anything. 然而,这没有做任何事情。 Since I think I'm just following the instructions and I have no errors in my console, I have no idea what I'm doing wrong here.
因为我认为我只是按照说明操作而且我的控制台没有错误,所以我不知道我在这里做错了什么。
Does anybody know how I can get this to work? 有谁知道我怎么能让这个工作? All tips are welcome!
欢迎所有提示!
You are missing .
你错过了
.
for the class selector. 对于类选择器。
$(document).ready(function() { $(function() { $("#ticket-event-list").accordion({ header: '.event' //-------^ here }); }); });
<link href="http://code.jquery.com/ui/1.9.2/themes/base/jquery-ui.css" rel="stylesheet" /> <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <script src="http://code.jquery.com/ui/1.9.2/jquery-ui.js"></script> <div id="ticket-event-list"> <div class="event" id="event1">First event</div> <div class="content">The content</div> <div class="event" id="event2">Second event</div> <div class="content">The other content</div> </div>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.