js支持扩展/折叠内容,如html5细节/摘要元素

django-html5accordion的Python项目详细描述


Django-HTML5Accordion添加了JS支持来扩展/折叠任何内容,如 HTML5细节/摘要元素。它可以在任何元素上调用,并接受 选项来设置summary内容的选择器,该内容应始终 保持可见(并充当展开/折叠隐藏内容的链接)。 滑动/向下动画的速度,当 details元素已展开,^{tt1}中元素的选择器$ 这不应该触发展开/折叠和回调fns。

依赖关系

安装

在Django项目设置中,将“HTML5Accordion”添加到已安装的应用程序中。

用法

链接js:

<script src="{{ STATIC_URL }}html5accordion/jquery.html5accordion.js"></script>

HTML示例:

<article class="details">
  <header class="summary">
    <p>This content will always be visible</p>
  </header>
  <div>
    <p>This content will expand/collapse when `.summary` is clicked</p>
  </div>
</article>

调用插件:

$('.details').html5accordion();

使用各种选项调用插件,这些选项显式配置为 默认值:

$('.details').html5accordion({
  summarySelector: '.summary',                // Selector for summary text
  slideSpeed: 200,                            // Slide animation speed (ms)
  expandedClass: 'open',                      // Class added when details are
                                                // expanded
  ignoredElements: 'button, a, input, label', // Elements within `summary` that
                                                // will not trigger expand/collapse
  initialSlideSpeed: null,                    // Slide animation speed (ms) for
                                                // already-expanded details
  openCallback: null,                         // Callback fn after open animation
  closeCallback: null                         // Callback fn after close animation
});

注意:要在初始加载时展开details元素,只需添加类 open(或作为选项expandedClass传递的任何类),或添加 属性open

欢迎加入QQ群-->: 979659372 Python中文网_新手群

推荐PyPI第三方库


热门话题
java如何拆分字符串(基于各种分隔符),但不保留空格?   解析。Json格式的txt文件和knime中的java   java Spring rest api为什么在rest api调用的响应中更改了数据类型   升华文本3抛出java。lang.ClassNotFoundException,而记事本++不存在   java Android指纹扫描仪在尝试5次后停止工作?   java Android如何设置精确的重复报警?   java如何使用HTTPGET connect为access API输入用户名和密码   java当测试报告显示没有测试失败时,Gradle为什么说“有失败的测试”?   用Gson实现java获取响应   MapReduce程序中函数错误的java不可映射参数   java spring安全性不符合自动代理的条件   java GWT使用异步回调进行同步/阻塞调用   java奇怪的类数组问题无法在jsp中显示   如何在java中使用PrinterJob使用epl打印条形码   java如何在JTable中居中单元格   将Java Mockito测试转换为Kotlin   html Java正则表达式模式匹配到多个相同标记   testCompile中缺少java Gradle(Android)多项目依赖项   在输入提示后输入字符串时发生java FileNotFoundException