Example: Sidebar Hover
You can simple add a "hover" effect, this could be a complet other image or simple the same image with other colors.
Its only important that the images has the same size and you have images for expand and collapse.
To use the "hover" effect, simple add the classname "EliseBox_hover" and the JavaScript will check it if can load the images.
When it can it will display the images when the user move the mouse over the Object.
Live Example
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 class="EliseBox_sidebar-collapse EliseBox_hover EliseBox_imgPath-newMenu">
<div style="padding: 5px; border: 1px solid #ccc; background-color: #eee; height: 300px; width: 120px;">
This is a simple test, with hover effect.<br>
<br>
When you move the mouse over the sidebar you will notice that it display you another image with a darker color.<br>
</div>
</div>
...