标签: collapsable

纯CSS崩溃/扩展div

我有一个纯CSS可折叠div,它基于使用:target伪造类的其他人的代码.我想要设置的是一个包含12个以上问题的页面,当您单击+按钮时,答案div会在下方展开.我无法弄清楚如何在这个页面上制作多个折叠div元素,而无需编写大量额外的CSS.任何人都有关于如何写这个的建议,所以我的CSS代码被最小化?(即,所以我不必为12个以上的问题输入一堆独特的选择器).

我不能使用Javascript,因为这是在一个不允许JS的wordpress.com网站上.

这是我的jfiddle:http://jsfiddle.net/dmarvs/94ukA/4/

<div class="FAQ">
    <a href="#hide1" class="hide" id="hide1">+</a>
    <a href="#show1" class="show" id="show1">-</a>
    <div class="question"> Question Question Question Question Question Question Question Question Question Question Question? </div>
        <div class="list">
            <p>Answer Answer Answer Answer Answer Answer Answer Answer Answer Answer Answer Answer Answer Answer Answer Answer Answer Answer </p>
        </div>
</div>
Run Code Online (Sandbox Code Playgroud)
/* source: http://www.ehow.com/how_12214447_make-collapsing-lists-java.html */

.FAQ { 
    vertical-align: top; 
    height:auto !important; 
}
.list {
    display:none; 
    height:auto;
    margin:0;
    float: left;
}
.show {
    display: none; 
}
.hide:target …
Run Code Online (Sandbox Code Playgroud)

css collapsable css3

81
推荐指数
5
解决办法
26万
查看次数

jquery mobile collapsible和galaxy tab 10.1 json响应给出了随机响应

jquery移动相当新,解析json的新手 - 做了很多研究无济于事.在settimeout函数中尝试了10秒延迟

我的应用程序在我的三星galaxy s2上正常工作,但在我的三星Galaxy平板电脑10.1上它做了以下.

使用最新jquery 1.2.0jquery-1.7.2

我打电话getlocations2.php,如果我返回四个或更少的项目,可折叠集合正确打开和关闭.如果我退回5件或更多物品:

  1. 我点击顶部可折叠以扩展它 - 没有任何反应
  2. 我点击第二个可折叠的h3,它首先打开可折叠
  3. 之后它可以随机重新扩展h3,但通常它是最后一个触摸并且未能打开的h3.
  4. 它可以在短时间内正常工作.

感谢您的任何提示:

代码:

function doajax2($vurl,$vdata,$vtype,$vfrom){   
    $.ajax({
        url: $vurl,
        dataType: 'json',
        data:$vdata,
        async: false,
        success: function(rtndata) {
            $.mobile.hidePageLoadingMsg(); //alert(result.toSource())   
            rtndata2=(JSON.stringify(rtndata, null, 4));
            rtndata2=rtndata2.substring(13);
            rtndata2=rtndata2.slice(0, -2)

            var res = eval(rtndata2);           
            $('.displaylocations').html('');    
            g_html=res[0].brand;

            if (res[0].id> -1){
                g_html=g_html+'<div data-role="collapsible-set" data-theme="f" >';
                for (var i=0;i<res.length;i++){
                //for (var i=0;i<6;i++){            
                    lochtml('loc',i,res[i].locid,res[i].loccode1,res[i].head,res[i].desc,res[i].lang,res[i].lat1,res[i].long1,res[i].img1,res[i].limit);        
                }
                g_html=g_html+'</div>';
            }

            console.log('g_html'+g_html);
            $('.displaylocations').css('display','none');           
            $(".displaylocations").html(g_html);    
                    //  $(".displaylocations").html(str);   


            setTimeout(function(){ //make sure displaylocations has been updated
                $('#lhead2').html('Tuhura <span lang="en">Locations</span>'); …
Run Code Online (Sandbox Code Playgroud)

ajax jquery json collapsable jquery-mobile

27
推荐指数
1
解决办法
736
查看次数

Visual Studio 2013 C++概述/折叠if/else/while代码区域

显然在VS13中,他们删除了选项 - >文本编辑器 - > C++ - >格式化中的概述部分.

有没有办法在VS2013 C++中折叠if/while/etc语句?我知道C#插件并且已经知道了,但我正在寻找C++环境的解决方案.

干杯!

c++ outlining collapsable visual-studio-2013

21
推荐指数
2
解决办法
1万
查看次数

jquery.fullPage.js如何在div中启用滚动而不影响节滚动

对,这不容易解释......我正在使用jquery.fullPage.js作为网站.我有一些可折叠的面板托管大量的副本,需要滚动.当我启用此面板上的滚动时,我的问题就开始了,因为它将我发送到下一部分.有没有办法让我在这个面板中滚动而不影响整页滚动?

多谢你们

javascript css jquery collapsable fullpage.js

15
推荐指数
1
解决办法
2万
查看次数

Twitter Bootstrap:仅将某些菜单项折叠为下拉列表

我想知道如何创建一个Twitter Bootstrap navbar来折叠该菜单中的项目,一旦调整浏览器窗口大小,一次一个或两个项目.

我见过的大多数导航栏都将整个导航栏折叠成一个下拉列表; 当窗口调整大小时,基本上隐藏了导航栏上的所有内容.但我需要它仍然显示一些菜单项; 所以部分崩溃.

这是我的意思的一个例子(下面的菜单):

主页| 关于| 服务| 订单| 联系

当浏览器窗口从右侧调整大小时,我想要它做的是将最后一个菜单项(或两个)放入下拉列表中,然后它看起来像这样:

主页| 关于| 服务| 更多

                    -> Order
                    -> Contact
Run Code Online (Sandbox Code Playgroud)

"更多"需要自动创建为下拉菜单,并自动在该下拉菜单中列出"订单"和"联系"菜单项.随着窗口变小,该导航栏中的更多项目将添加到该下拉菜单中.当浏览器窗口调整为全屏宽度时,导航栏将恢复正常.这就是我们所需要的.

在我看过的很多链接中,这里有几个我发现的链接(不会将整个导航栏敲入一个下拉菜单)但仍然像所有其他链接一样,它没有按照我的描述进行操作:

  1. http://jsfiddle.net/caio/gvw7j/embedded/result/
  2. Twitter Bootstrap多级下拉菜单

使用上面的任何例子,达到我需要的最佳方法是什么?

menu collapsable navbar twitter-bootstrap drop-down-menu

14
推荐指数
1
解决办法
7566
查看次数

在bootstrap折叠手风琴中显示部分文字

我想替换一个允许用户使用Bootstrap折叠手风琴"阅读更多"的脚本.我的问题是,据我所见,手风琴是打开还是关闭.

有没有人知道在封闭模式下显示某些文本的选项?

在我正在使用的脚本中,我可以通过更改文本区域的高度来显示一些文本,但在Bootstrap中此选项不起作用.当我更改.in.out(控制文本区域高度的css)的高度时,它只是打开和关闭直到该高度.有人为此找到了解决方法吗?

我的HTML:

<div class="accordion" id="accordion2"> 
  <div class="accordion-group"> 
    <div class="accordion-heading"> 
      <a class="accordion-toggle"  href="#collapseOne"
         data-toggle="collapse" data-parent="#accordion2">
        TITLE OF THE COLLAPSE 
    </a> 
    </div> 
    <div id="collapseOne" class="accordion-body collapse in"> 
      <div class="accordion-inner"> 
        DATA IN THE COLLAPSE 
      </div> 
    </div>
  </div>
</div>
Run Code Online (Sandbox Code Playgroud)

css accordion collapsable twitter-bootstrap

12
推荐指数
1
解决办法
9279
查看次数

为什么可折叠Bootstrap面板中的表会改变宽度?

我在这里放了一个Bootply演示:http://www.bootply.com/Ss2aAnzqlZ.

根据http://getbootstrap.com/components/#panels-tables,它是一个带有表格的面板.但是,我也让面板可以折叠.折叠位工作正常,但表本身不保留形状.正如您在Bootply中看到的那样,当您第一次加载页面时,它不会填充面板的宽度.单击面板标题中的"改进"以折叠面板时,该表在动画期间占据整个面板宽度,然后消失.当您再次单击以显示面板内容时,该表是动画停止前的全宽,此时,它会缩回到看起来像"自动"宽度的位置.

奇怪的是,检查表格元素表明表格本身是全宽的,但是thead,tbody和tfoot不是.

我有点跟踪表格中"崩溃"类的存在.如果在没有"折叠"类的情况下启动Bootply,则在折叠面板之前它是全宽的.当你展开它时,它会回到自动宽度.我不知道为什么......你呢?

这是片段,但崩溃似乎不会在这里运行.Bootply更好.

<link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/css/bootstrap.min.css" rel="stylesheet">
<script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.0/js/bootstrap.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.3/jquery.min.js"></script>
<div style="margin:15px">
    <div class="panel panel-default">
        <div class="panel-heading">
            <a href="#" data-toggle="collapse" data-target="#improvementsPanel" aria-expanded="true" class="">Improvements</a>
        </div>
        <table id="improvementsPanel" class="table panel-collapse collapse in" aria-expanded="true" style="">
            <thead>
                <tr>
                    <th>Description</th>
                    <th class="text-right">Qty</th>
                    <th>UOM</th>
                    <th class="text-right">Rate</th>
                    <th class="text-right">Value</th>
                </tr>
            </thead>
            <tbody>
                <tr>
                    <td>Item 1</td>
                    <td class="text-right">133.00</td>
                    <td>m²</td>
                    <td class="text-right">425.00</td>
                    <td class="text-right">56,525</td>
                </tr>
                <tr>
                    <td>Item 2</td>
                    <td class="text-right">85.00</td>
                    <td>m²</td>
                    <td class="text-right">70.00</td>
                    <td class="text-right">5,950</td>
                </tr>
                <tr>
                    <td>Item 3</td>
                    <td class="text-right">25.00</td> …
Run Code Online (Sandbox Code Playgroud)

html-table panel collapsable twitter-bootstrap-3

12
推荐指数
2
解决办法
8498
查看次数

可折叠部分:[Assert] 无法确定 preReloadFirstVisibleRow (0) 的新全局行索引

我正在 UITableViewController 中实现可折叠的部分标题。

以下是我确定每个部分显示多少行的方法:

override func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int
{
    return self.sections[section].isCollapsed ? 0 : self.sections[section].items.count
}
Run Code Online (Sandbox Code Playgroud)

有一个结构体保存了带有“isCollapsed”布尔值的部分信息。

这是我如何切换他们的状态:

private func getSectionsNeedReload(_ section: Int) -> [Int]
{
    var sectionsToReload: [Int] = [section]

    let toggleSelectedSection = !sections[section].isCollapsed

    // Toggle collapse
    self.sections[section].isCollapsed = toggleSelectedSection

    if self.previouslyOpenSection != -1 && section != self.previouslyOpenSection
    {
        self.sections[self.previouslyOpenSection].isCollapsed = !self.sections[self.previouslyOpenSection].isCollapsed
        sectionsToReload.append(self.previouslyOpenSection)
        self.previouslyOpenSection = section
    }
    else if section == self.previouslyOpenSection
    {
        self.previouslyOpenSection = -1
    }
    else
    {
        self.previouslyOpenSection = section
    } …
Run Code Online (Sandbox Code Playgroud)

assert collapsable ios swift uitableviewsectionheader

11
推荐指数
1
解决办法
2114
查看次数

Jquery Mobile:动态更改可折叠div的标题文本?

<div data-role="collapsible" data-content-theme="e" id="collapsePlace">
    <h3>Place:</h3>
    <!--things...-->
</div>
Run Code Online (Sandbox Code Playgroud)

如何<h3>在可折叠div中动态更改标题文本('Place:')?

我试过了:

$('#collapsePlace').children('h3').text('new text');
Run Code Online (Sandbox Code Playgroud)

它改变了文本 - 但失去了所有的造型!

jquery collapsable jquery-mobile

8
推荐指数
2
解决办法
2万
查看次数

可扩展的GridView,在Android中使用视图回收

我正在尝试实现一个Android活动,其中我有一些项目(例如汽车品牌及其模型).

我希望能够在网格中显示项目(例如固定为3列),并且每个网格都可以折叠.实际上我想要的是ExpandableList视图对ListViews的作用,但是使用GridView.

不幸的是,如果我在ExpandableListAdapter中返回GridView,则此GridView中的项目将不会被回收,因为它们在滚动期间移出屏幕.我们有很多项目要显示,这会导致严重的内存问题.

我将如何实现这样的目标?

问候本

例

android gridview collapsable expandable

8
推荐指数
1
解决办法
9431
查看次数