使用jquery v1.3.2和jQuery UI 1.7.1
我有一个标签控件,其中有3个标签.每个标签包含1个手风琴控件.
$(document).ready(function() {
$('#acc1').accordion({ collapsible: true, autoHeight: false });
$('#acc1').accordion({ collapsible: true, autoHeight: false });
$('#acc1').accordion({ collapsible: true, autoHeight: false });
$('#tabControl').tabs();
});
tabControl在页面加载时不可见.有按钮打开它.
$("#btnShow").bind("click", function() {
$('#tabControl').slideToggle("slow");
});
我找不到将所有手风琴控制器折叠的方法.每当我显示tabControl时,手风琴中的第一个项目总是会扩展.
我试过这个:
$('#acc1First').css('display', 'none');
$('#acc2First').css('display', 'none');
$('#acc3First').css('display', 'none');
$('#acc1First').slideUp();
$('#acc2First').slideUp();
$('#acc3First').slideUp();
但它有时会出现问题,第一项需要点击2次才能正常工作等.
有没有办法初始化折叠控制所有项目折叠？
谢谢
在AngularJS UI Bootstrap中我想在单击面板标题时激活isopen,但我找不到方法.此版本仅在您单击链接时激活.
这是我尝试过的;
<accordion-group is-open="isopen">
<accordion-heading ng-click="isopen=!isopen">
I can have markup, too!
<i class="pull-right glyphicon"
ng-class="{'glyphicon-chevron-down': isopen, 'glyphicon-chevron-right': !isopen}"></i>
</accordion-heading>
This is just some content to illustrate fancy headings.
</accordion-group>
ng-click ="isopen =!isopen "
提前致谢..
通过使用Telerik Extensions for ASP.NET MVC,如何在页面加载时隐藏所有Accordion选项卡？默认情况下,它会在页面加载时展开第一个Accordion选项卡!非常感谢!
我正在尝试使用Twitter Bootstrap在另一支手风琴中实现手风琴.可能吗？如果是这样,那么请帮助我代码,因为我尝试实现它但我没有成功.
我遇到了jQuery手风琴的问题.当我创建一个内容窗格,其中非默认窗格的内容多于默认窗格,并且autoHeight为true时,这会在切换窗格时提供很好的动画,但非默认窗格会获得我不想要的滚动条.
您可以通过访问http://jqueryui.com/themeroller/,切换到"Blitzer"或"Humanity"等主题,然后打开示例手风琴的第3部分来看到这一点.使用Safari 3.2.1和Firefox 3.0.8发生在我身上.
如果切换到autoHeight = false,则不会发生这种情况,并且所有内容窗格都具有正确的高度,但内容窗格仅在动画结束时呈现并且看起来很奇怪,所以我不得不关闭动画以避免这种陌生感.
我要误读一些东西,或者这是jQuery UI手风琴中的一个错误.请帮我弄清楚它们中的哪一个(或两者都是).
我正在寻找创建Accordion风格小部件的最佳方式,例如在此页面上.有没有办法使用标准的Android工具包实现相同的效果,还是我需要构建自定义小部件？如果是的话 - 如果有的话,你会推荐哪一个？
我是jquery的新手,我试图找出是否有可能在没有箭头图标的情况下创建简单的手风琴而且根本没有填充手风琴内容.
我想使用整个内容空间,似乎jquery accordion widget自动创建一些填充作为箭头图标的宽度.
谢谢!利奥尔
我正在使用bootstrap提供的崩溃插件,这是一个jquery简单的插件
但是它默认崩溃,如何修改以便崩溃项默认隐藏,只有当我按下标题,然后项目崩溃并显示？谢谢
$(document).ready( function () {
$(".collapse").collapse()({
toggle: false,
show: false
});
} );
这是html:
<div class="accordion-group">
<div class="alert alert-info" data-toggle="collapse" href="#collapse1" style="margin-bottom:0px;">
Collapsible #1
</div>
<div id="collapse1" class="accordion-body collapse" style="background-color:#ffffff;">
content1
</div>
<div class="alert alert-info" data-toggle="collapse" href="#collapse2" style="margin-bottom:0px;">
Collapsible #2
</div>
<div id="collapse2" class="accordion-body collapse" style="background-color:#ffffff;">
content2
</div>
我正在努力创造一种能够同时扩展多个面板的手风琴.我试图在jQuery UI API中找到它,但我还没有找到正确的方法.
如果有办法使用jQuery UI手风琴,请告诉我.
我正在使用Bootstrap 3并尝试设置以下手风琴/折叠结构:
Onload:组中的每个手风琴面板都完全折叠,并按照记录/预期运行.
按钮单击:每个折叠面板展开并单击切换无效(包括URL锚点效果).
另一个按钮点击:所有面板返回onload状态; 所有折叠和可点击正常.
我已经进入第2步了,但是当我在第3步再次单击该按钮时它没有任何效果.我还看到Chrome Dev Tools中没有报告控制台错误,也没有通过本地JSHint运行代码.
我希望每次单击按钮时此循环都是可重复的.
我在这里设置了我的代码http://bootply.com/98140和http://jsfiddle.net/A9vCx/
我很想知道我做错了什么,我很感激建议.谢谢!
我的HTML:
<button class="collapse-init">Click to disable accordion behavior</button>
<br><br>
<div class="panel-group" id="accordion">
<div class="panel panel-default">
<div class="panel-heading">
<h4 class="panel-title">
<a data-toggle="collapse" data-parent="#accordion" href="#collapseOne">
Collapsible Group Item #1
</a>
</h4>
</div>
<div id="collapseOne" class="panel-collapse collapse">
<div class="panel-body">
Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid.
</div>
</div>
</div>
<div class="panel panel-default">
<div class="panel-heading">
<h4 class="panel-title">
<a data-toggle="collapse" data-parent="#accordion" href="#collapseTwo">
Collapsible Group Item …