Example: Sidebar Group Keep Open
The normal Group option allow it to close and open every element, but with the EliseBox_groupKeepOpen option you can force ByRei EliseBox to keep at last one Element open.
Take a look at the following example, it is not possible to close all Objects at the same time.
Live Example
This is a test Text, but it could be also a description or all other kind of Information.
This is a test Text, but it could be also a description or all other kind of Information.
This is a test Text, but it could be also a description or all other kind of Information.
This is a test Text, but it could be also a description or all other kind of Information.
This is a test Text, but it could be also a description or all other kind of Information.Test W3C Validation:
HTML Code
...
<script type="text/javascript" src="byrei-elisebox_0.6.js"></script>
<script type="text/javascript">
if (typeof(ByRei_EliseBox) !== "undefined") {ByRei_EliseBox.config.path.img = '../images/';}
</script>
<div style="width: 200px; border: 1px solid #ccc; overflow: hidden">
<div class="EliseBox_sidebar-expand EliseBox_hover EliseBox_pos-bottom EliseBox_group-picbox EliseBox_groupKeepOpen" style="width: 200px;">
<div style="width: 200px;">
<h3> Image 1 </h3>
<img src="../images/elsch-001.jpg" width="99" height="130" alt="" style="float: right;">
This is a test Text, but it could be also a description or all other kind of Information.<br>
When you like this Tools share it with your friends or coworker.<br>
<br>
Click another bar...
</div>
</div>
<div class="EliseBox_sidebar-collapse EliseBox_hover EliseBox_pos-bottom EliseBox_group-picbox EliseBox_groupKeepOpen" style="width: 200px;">
<div style="width: 200px;">
<h3> Image 2 </h3>
<img src="../images/elsch-002.jpg" width="99" height="130" alt="" style="float: right;">
This is a test Text, but it could be also a description or all other kind of Information.<br>
When you like this Tools share it with your friends or coworker.<br>
<br>
Click another bar...
</div>
</div>
<div class="EliseBox_sidebar-collapse EliseBox_hover EliseBox_pos-bottom EliseBox_group-picbox EliseBox_groupKeepOpen" style="width: 200px;">
<div style="width: 200px;">
<h3> Image 3 </h3>
<img src="../images/elsch-003.jpg" width="130" height="99" alt="" style="float: right;">
This is a test Text, but it could be also a description or all other kind of Information.<br>
When you like this Tools share it with your friends or coworker.<br>
<br>
Click another bar...
</div>
</div>
<div class="EliseBox_sidebar-collapse EliseBox_hover EliseBox_pos-bottom EliseBox_group-picbox EliseBox_groupKeepOpen" style="width: 200px;">
<div style="width: 200px;">
<h3> Image 4 </h3>
<img src="../images/elsch-004.jpg" width="130" height="109" alt="" style="float: right;">
This is a test Text, but it could be also a description or all other kind of Information.<br>
When you like this Tools share it with your friends or coworker.<br>
<br>
Click another bar...
</div>
</div>
<div class="EliseBox_sidebar-collapse EliseBox_hover EliseBox_pos-bottom EliseBox_group-picbox EliseBox_groupKeepOpen" style="width: 200px;">
<div style="width: 200px;">
<h3> Image 5 </h3>
<img src="../images/elsch-005.jpg" width="99" height="130" alt="" style="float: right;">
This is a test Text, but it could be also a description or all other kind of Information.<br>
When you like this Tools share it with your friends or coworker.<br>
<br>
Click another bar...
</div>
</div>
</div>
...