所以,我有一个非常基本的jQuery折叠全部完成了,但对我的生活,我不能挑出什么原因造成我的手风琴内容这里面的白色盒子。
我会在这里发布我的jsfiddle链接,便于访问我的代码。
http://jsfiddle.net/bQ5Gd/1/
我敢肯定,你们中的一个会挑它关闭在几秒钟内,我只是在JQUERY非常初学者。
谢谢!
HTML
<div id="accordion">
<h3>This is a test<h3>
<div>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed libero metus, aliquet vel euismod id, mattis sed quam. Nulla interdum leo adipiscing enim commodo hendrerit vel vitae lectus. Vivamus vehicula orci ac leo luctus ac egestas purus eleifend. Vivamus ac mauris risus, quis tempor massa. .</p>
</div>
</div> <b>This text moves down with ACCORDION</b>
使用Javascript
$(function () {
$("#accordion").accordion({
event: "click",
active: false,
collapsible: true,
autoHeight: false
});
});
CSS
#accordion {
width: 400px;
}
#accordion .ui-accordion-content > * {
margin: 0px;
}
#accordion .ui-accordion-content {
width: 100%;
background-color: #777;
color: #000;
border: none;
font-size: 10pt;
line-height: 15pt;
}
#accordion .ui-accordion-content a {
color: #777;
}
#accordion .ui-accordion-header {
background-color: #ccc;
margin-left: auto;
margin-right: auto;
border: #fff;
}
#accordion .ui-accordion-header {
background-color: #fff;
background-image: -moz-linear-gradient(top, #fff 0%, #fff 100%);
/* FF3.6+ */
background-image: -webkit-gradient(linear, left top, left bottombottom, color-stop(0%, #fff), color-stop(100%, #fff));
/* Chrome,Safari4+ */
background-image: -webkit-linear-gradient(top, #fff 0%, #fff 100%);
/* Chrome10+,Safari5.1+ */
background-image: -o-linear-gradient(top, #fff 0%, #fff 100%);
/* Opera 11.10+ */
background-image: -ms-linear-gradient(top, #fff 0%, #fff 100%);
/* IE10+ */
background-image: linear-gradient(to bottombottom, #fff 0%, #fff 100%);
/* W3C */
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fa9300', endColorstr='#dc621e', GradientType=0);
/* IE6-9 */
}