Page History

<!-- VOORBEELD EXPAND EN COLLAPSE BUTTONS -->

<style type="text/css">
  
  .buttons_expand-collapse_all{
    font-size: 12px;
 	color: white;
    border-width: 1px;
    border-radius: 0.5em;
    border-style: solid;
    border-color: #000000;
    background-color: #00a6ff;
	padding: 5px 12px;
  }

  .buttons_expand-collapse_all:hover {
    font-size: 12px;
    color: white;
    border-width: 1px;
    border-radius: 0.5em;
    border-style: solid;
    border-color: #000000;
    background-color: #0092e0;
	padding: 5px 12px;
  }
</style>
<div class="div_expand-collapse_all">
  <br />
  <button
    class="buttons_expand-collapse_all"
    name="expandAll"
    id="expandAll"
    type="button"
  >
    Expand All
  </button>
  <button
    class="buttons_expand-collapse_all"
    name="collapseAll"
    id="collapseAll"
    type="button"
  >
    Collapse All
  </button>
</div>

<script type="text/javascript">
  AJS.toInit(function () {
    AJS.$("#expandAll").click(function () {
      AJS.$(".expand-container").each(function () {
        if (
          AJS.$(".expand-content", this)
            .css("display", "none")
            .css("opacity", "0")
        ) {
	 	  AJS.$(".expand-icon", this).removeClass("aui-iconfont-chevron-right");
          AJS.$(".expand-icon", this).addClass("aui-iconfont-chevron-down");
          AJS.$(".expand-content", this).removeClass("expand-hidden");
          AJS.$(".expand-content", this).css("display", "block");
          AJS.$(".expand-content", this).css("opacity", "1");
        }
      });
    });
  });
</script>

<script type="text/javascript">
  AJS.toInit(function () {
    AJS.$("#collapseAll").click(function () {
      AJS.$(".expand-container").each(function () {
        if (
          AJS.$(".expand-content", this)
            .css("display", "block")
            .css("opacity", "1")
        ) {
	      AJS.$(".expand-icon", this).removeClass("aui-iconfont-chevron-down");
          AJS.$(".expand-icon", this).addClass("aui-iconfont-chevron-right");
          AJS.$(".expand-content", this).addClass("expand-hidden");
          AJS.$(".expand-content", this).css("display", "none");
          AJS.$(".expand-content", this).css("opacity", "0");
        }
      });
    });
  });
</script>