Here are some examples to show blocks available in smartVISU


A static block
<div class="block">
<div class="ui-bar-c ui-li-divider ui-corner-top">Block 1</div>
<div class="ui-fixed ui-body-a ui-corner-bottom">

<p>This is a static block</p>

Block 1

This is a static block

A variable set of blocks which are collapsible. Use 'set-1', 'set-2', 'set-3' to define the number of sections in a block.
Set the attribute 'data-collapsed="false"' for the open section (only one) and omit the attribute for the others.
You can also define the width of the block by adding a width statement to the first div (see last example).
<div class="block">
<div class="set-2" data-role="collapsible-set" data-theme="c" data-content-theme="a" data-mini="true">

<div data-role="collapsible" data-collapsed="false">
<h3>Section 1</h3>

<p>Set of two collapsible blocks with one being collapsed</p>

<div data-role="collapsible">
<h3>Section 2</h3>

<p>Collapsed by default if 'data-collapsed=&quot;false&quot;' is omitted</p>


Block 2

This is a collapsible block

Section 1

Set of two blocks with one being collapsible

Section 2

Collapsed by default if 'data-collapsed="false" ' is omitted

Section 1

A set of 3 collapsible blocks

The description 'style="width:100%" ' has been added to the <div class="block"> statement in order to make the block use the whole available width of the screen.

Section 2

Content 2

Section 3

Content 3