# depicter/trunk/resources/scripts/loadings/snippets/bars/light.html

Depicter — Popup & Slider Builder, version trunk. 93 lines.

- Page: https://pluginprobe.com/plugins/depicter/trunk/code/resources/scripts/loadings/snippets/bars/light.html
- Raw: https://pluginprobe.com/plugins/depicter/trunk/raw/resources/scripts/loadings/snippets/bars/light.html
- Modified: 2022-06-01T06:26:20+00:00

Line numbers below start at 1. Link to a line or a range by appending a fragment to the
page URL, for example `https://pluginprobe.com/plugins/depicter/trunk/code/resources/scripts/loadings/snippets/bars/light.html#L10-L20`.

```html
<svg class="depicter-single-svg-loading" viewBox="0 0 135 140" xmlns="http://www.w3.org/2000/svg" fill="#fff">
   <rect y="10" width="15" height="120" rx="6">
      <animate
         attributeName="height"
         begin="0.5s"
         dur="1s"
         values="120;110;100;90;80;70;60;50;40;140;120"
         calcMode="linear"
         repeatCount="indefinite"
      />
      <animate
         attributeName="y"
         begin="0.5s"
         dur="1s"
         values="10;15;20;25;30;35;40;45;50;0;10"
         calcMode="linear"
         repeatCount="indefinite"
      />
   </rect>
   <rect x="30" y="10" width="15" height="120" rx="6">
      <animate
         attributeName="height"
         begin="0.25s"
         dur="1s"
         values="120;110;100;90;80;70;60;50;40;140;120"
         calcMode="linear"
         repeatCount="indefinite"
      />
      <animate
         attributeName="y"
         begin="0.25s"
         dur="1s"
         values="10;15;20;25;30;35;40;45;50;0;10"
         calcMode="linear"
         repeatCount="indefinite"
      />
   </rect>
   <rect x="60" width="15" height="140" rx="6">
      <animate
         attributeName="height"
         begin="0s"
         dur="1s"
         values="120;110;100;90;80;70;60;50;40;140;120"
         calcMode="linear"
         repeatCount="indefinite"
      />
      <animate
         attributeName="y"
         begin="0s"
         dur="1s"
         values="10;15;20;25;30;35;40;45;50;0;10"
         calcMode="linear"
         repeatCount="indefinite"
      />
   </rect>
   <rect x="90" y="10" width="15" height="120" rx="6">
      <animate
         attributeName="height"
         begin="0.25s"
         dur="1s"
         values="120;110;100;90;80;70;60;50;40;140;120"
         calcMode="linear"
         repeatCount="indefinite"
      />
      <animate
         attributeName="y"
         begin="0.25s"
         dur="1s"
         values="10;15;20;25;30;35;40;45;50;0;10"
         calcMode="linear"
         repeatCount="indefinite"
      />
   </rect>
   <rect x="120" y="10" width="15" height="120" rx="6">
      <animate
         attributeName="height"
         begin="0.5s"
         dur="1s"
         values="120;110;100;90;80;70;60;50;40;140;120"
         calcMode="linear"
         repeatCount="indefinite"
      />
      <animate
         attributeName="y"
         begin="0.5s"
         dur="1s"
         values="10;15;20;25;30;35;40;45;50;0;10"
         calcMode="linear"
         repeatCount="indefinite"
      />
   </rect>
</svg>

```