如何使单击的Jquery可折叠div粘贴到顶部

我正在为我的应用程序使用Jquery可折叠div。 我的要求是

我试图使Jquery collapasable div中单击的元素固定到顶部，当您向上滚动以使其处于视图中时，它将恢复固定并返回显示为block

我的尝试如这把小提琴所示

---

你能告诉我如何实现这一点吗

这一行的任何目的$'.my collapsible'.关于'collapsiblecollapse'，函数{}；那你为什么要写这条线？

<div data-role="content" class="data">
        <div class="my-collaspible" data-inset="false"  data-role="collapsible">
            <h3>Header 1</h3>
            <p>Content</p>
            <p>Content</p>

        </div>

         <div class="my-collaspible" data-inset="false"  data-role="collapsible"  >
            <h3>Header 2</h3>
            <p>Content</p>
        </div>

           </div>



$(document).ready(function(){

  $('.my-collaspible').on('collapsibleexpand', function() {

    $('.my-collaspible').not(this).collapsible("collapse")
  });
  $('.my-collaspible').on('collapsiblecollapse', function() {});
});