我在wordpress博客上使用jQuery手风琴。每当作者上传新文章时,它都会添加面板(新文章=新面板)。如何制作,加载页面时,第一个面板是打开的?我已经阅读了几个教程,但似乎所有这些都依赖于可以通过php改变的可折叠手风琴?我想,我需要某种功能来确定在触发第一个面板打开之前有多少个面板?
这是我的jQuery代码:
jQuery(document).ready(function($) {
try{Typekit.load();}catch(e){}
(function($) {
// What does the accordion plugin do?
$.fn.accordion = function(options) {
if (!this.length) { return this; }
var opts = $.extend(true, {}, $.fn.accordion.defaults, options);
this.each(function() {
var $this = $(this).find('dl');
var $all_panels = $this.find("dd");
if(Modernizr.cssanimations)
{
$this.find("dt:first .arrow").addClass();
}
else
{
$this.find("dt:first .arrow").addClass();
}
$this.find("dt > a").on('click', function(event){
event.preventDefault();
if(!$(this).parent().hasClass('active'))
{
$all_panels.slideUp();
var $active = $('dl .active').removeClass('active');
$(this).parent().next().slideDown().addClass('active');
$(this).parent().addClass('active');
if(Modernizr.cssanimations)
{
$active.filter('dt').find('.arrow').removeClass('down-anim');
$(this).parent().find('.arrow').addClass('down-anim');
}
else
{
$active.filter('dt').find('.arrow').removeClass('down');
$(this).parent().find('.arrow').addClass('down');
}
}
});
});
return this;
};
// default options
$.fn.accordion.defaults = {};
})(jQuery);
// call plugin
$(".accordion").accordion()
});
在我的PHP代码中,我致电<dl>
&amp; <dt>
一次并将其发送到循环中,因此它会根据有多少篇文章而相乘。
所以这是它给我的HTML:
<div class="accordion">
<dl>
<dt>
<a href="#"><span class="arrow"></span><div class="accordion-user"></div></a>
</dt>
<dd>
<img class="author_image" src=".../my_directory/150x190.png">
<div class="author_wrapper">
</div>
</dd>
</dl>
<dl>
...
</dl>
<dl>
...
</dl>
</div>
......等等......
非常感谢: - )