论坛首页 Web前端技术论坛

自制简单的JQuery accordion插件

浏览 3160 次
精华帖 (0) :: 良好帖 (0) :: 新手帖 (0) :: 隐藏帖 (0)
作者 正文
   发表时间:2008-06-26  
写了一个jQuery插件 
不知道是否代码还可以更短更精炼些。多多指点哟~

firstOpen属性是说明一开始默认打开第几个。

jQuery.fn.extend({
//start
  ejqaccordion: function(options) {
  var firstOpen=-1;
  if(options)
  firstOpen=(options.firstOpen!=null&&options.firstOpen>=0)?options.firstOpen:-1;
  $(this).find("dd:visible").css("display","none");
  if(firstOpen>=0)
  $($(this).find("dd").get(firstOpen)).css("display","block");
  $(this).find("dt").click(function(){
      var vdd=$(this).parent().find("dd:visible");
      var ndd=$(this).next();
      vdd.slideUp('fast');
      if(ndd.css("display")=="none")
      ndd.slideDown('fast');
  });
  }
});


<dl id="accordion">
					<dt>title1</dt> 
					<dd>i am 1</dd>
					<dt>title2</dt>
					<dd>i am 2</dd>
					<dt>title3</dt>
					<dd>i am 3</dd>
				</dl>


调用代码:
$("#accordion").ejqaccordion({firstOpen:0});
论坛首页 Web前端技术版

跳转论坛:
Global site tag (gtag.js) - Google Analytics