使用bootstrap向下滚动并备份

时间:2015-12-24 00:53:59

标签: javascript jquery html html5 twitter-bootstrap

我有一个几乎位于页面底部的折叠表单,问题是当它打开时,用户必须向下滚动才能完全看到它。有没有办法让它在打开时自动向下滚动,如果可能的话,最好在关闭时向上滚动?

这是我的代码:

<style type="text/css">
    .bs-example{
        margin: 20px;
    }
    .table-nonfluid {
        width: auto !important;
    }
</style>
     <div class="container">
      <button  type="button" class="btn btn-info" data-toggle="collapse" data-target="#demo">Status Updates</button>
      <div id="demo" class="collapse">


    <div class="bs-example">
    <table class="table table-bordered table-nonfluid">
    <thead>
    <tr>
    <th>Time</th>
    <th>Update</th>
    </tr>
    </thead>
    <tbody>

    <tr class="active">
    <td>Jan 5</td>
    <td>Demo 2</td>
    </tr>

    <tr class="active">
    <td>Jan 4</td>
    <td>Demo 1</td>
    </tr>

    </tbody>
    </table>
    </div>

1 个答案:

答案 0 :(得分:1)

button添加:onclick="repositionCollapse('#demo')"

和Javascript,其中home是要在未展开时滚动回来的元素的ID:

<script>
function repositionCollapse(section)
{
    if(location.href == section) location.href = '#home';
    else location.href = section;
}
</script>