README

作者：TheCelavi
版本：1.0.0
稳定性：稳定
日期：2012年11月29日
由 Run Open Code 提供
许可证：免费提供给所有人

dmTabsBehaviorPlugin 可以增强页面上的显示内容，将一些 HTML 结构转换为标签控制。

如何使用？

dmTabsBehaviorPlugin 预期有一个容器，其中包含标签标题和标签内容，例如

<container>
    <title></title>
    <title></title>
    <title></title>
    ...
    <content></content>
    <content></content>
    <content></content>
    ...
</container>

dmTabsBehaviorPlugin 还可以处理标题和内容的交替，这为您提供了更大的灵活性

<container>
    <title></title>
    <content></content>
    <title></title>
    <content></content>
    <title></title>
    <content></content>
    ...
</container> 

请注意，必须有相同数量的 title 和 content 元素。

在这个例子中，container、title 和 content 是为了说明目的，当然，它们必须是有效的 HTML 标签（例如，DIV 或 UL/LI）。这里使用的标签名称是为了更容易地与标签界面元素相关联。

但是，使用此行为的最简单方法是向区域添加偶数个小部件，其中一半用于标签标题，一半用于内容。需要将行为附加到区域，这样就完成了。

HTML 输出

根据前面的文本中展示的结构，行为将更改为下面的结构

<div class="dmTabsBehavior theme">
    <div class="tab-titles-wrapper">
        <title class="tab-title tab-title-index-0 tab-open"></title>    
        <title class="tab-title tab-title-index-1 tab-closed"></title>    
        <title class="tab-title tab-title-index-2 tab-closed"></title>
    </div>
    <div class="tab-contents-wrapper">
        <content class="tab-content tab-content-index-0 tab-open"></content>
        <content class="tab-content tab-content-index-1 tab-closed"></content>
        <content class="tab-content tab-content-index-2 tab-closed"></content>
    </div>
</div>

考虑到以下几点，您可以轻松地设计标签控制的每个方面，并调整到您的需求。

请注意类 tab-open 和 tab-closed - 它们标记每个标签控制元素的状态。

每个标签标题和标签内容容器都有一个索引类，以便进行更多的设计定制。

配置和主题

在 dmTabsBehaviorPlugin/config/dm/config.yml 中有此行为的配置参数。

default:
  dmTabsBehavior:
    defaults:
      inner_target: ''
      theme: default
      title: at_top
      event: click
      animation: slide
      easing: jswing
      duration: 500
      initialy_open: 1
    themes: 
      default: 'dmTabsBehaviorPlugin.default'

如果您通过 Github 下载了此行为，您可以修改此文件。如果您通过 Composer 安装了它，那么您必须使用 Symfony 配置级联来覆盖这些设置。

部分 defaults 包含行为的默认设置，这是行为最初显示的内容。如果您想显示其他设置作为默认设置，这是更改的地方。

部分 themes 用于主题，它配置为 theme_key: path_to_css_file。如果用户在行为表单中选择 default 主题，标签视图的 HTML 结构将是

<div class="dmTabsBehavior default">
	.... titles and contents
</div>

请注意，已添加 default 类，即主题键。当然，主题 CSS 文件也将被加载。因此，您只需为主题进行设计即可。