Børre Stenseth

Structure

When you run this script at the bottom of your page:

<script type="text/javascript"> 
   itemHolder.initElements();
</script>

all elements marked with class itembox is transformed:

structure.png

This:

<div id="structure"
  class="itembox drag expand on" 
  style="position:fixed;right:0px;top:300px" 
  title="ItemBox Structure">
  <img src="structure.png" alt="structure.png"/>
</div>

has resulted in the following on your website:

<div class="itembox readybox" 
  id="structureWrapper" 
  style="position:fixed;right:0px;top:300px;z-index:2;" 
  title="ItemBox Structure">
  <div class="header drag">
    ItemBox Structure
	<span class="toggler on"></span>
  </div>
  <div style="display:block" class="content" 
    id="structure">
    <img alt="structure.png" src="structure.png">
  </div>
</div>

Acess from JS

You can allways access and change elements in the structure by using the id.

var id="structure";
var myContent=document.getElementById(id);
var myWrapper=document.getElementById(id+"Wrapper);
// or
var allBoxes=document.querySelectorAll(".readybox");
// or
var allContentElts=document.querySelectorAll(".readybox .content");

This will give you an opportunity to access and change style, classnames and content by using normal element functionality.

NOTE that the Javascript library also gives you access to an object associated with the html-element. More on page JS-library .

Maintainance

B Stenseth, januar 2015