CodeThatXPBar User Manual 

 123GUIDE (get started)

You can read a breaf tutorial here.

Please bear in mind that CodeThat scripts come in two editions STANDARD and PRO. Editions differ by the features set and license type.

Standard version is given for free and comes with the inscription representing our company's name. Upon registration you will get rid of that text.

 Read Standard vs PRO to know the differences between CodeThatXPBar Standard and PRO.

 INTRODUCTION

With CodeThatXPBar you can

The configuration of the CodeThatXPBar can be stored in the separate js file.

To describe new CodeThatXPBar create an object with following structure:

var BarDef = {
	"style" : {}
	"scroller" : {}
   	"itemover" : {},
	"position" : {},
	"items" : [ ]
};               

where

 items - submenu items
 style - box-item/box style
 itemover - box-item style when in "mouseover" state
 position - box position (either relative or absolute)

To describe an item use following structure:

"items" :[
"style"
 { 
css	:string				: CSS class
size	:[width, height]		: item width/height
align	:string				: text alignment 
					  (left/right/center/middle)
color	:string				: color string for the text
bgimg	:string				: url of the background image
bgcolor	:string				: color string
shadow	:{"color":string, "width":int}	: shadow parameters
border	:{"color":string, "width":int}	: border parameters
imgitem	:{"src":string,
	  "width":int,"height":int}	: bullet image for non-submenu 
					  (bar) or plain (tree) items
					  or default bullet for a menu item
imgdir	:{"src":string,
	  "width":int,"height":int}	: bullet image for submenu items
imgdiropen :{"src":string,
	     "width":int,"height":int}	: bullet image for open submenu with items
imgendon   :{"src":string,
	     "width":int,"height":int}	: end item bullet when in "on" or "opened" state
imgendoff  :{"src":string,
	     "width":int,"height":int}	: end item bullet when in "off" or "closed" state
z	   :int				: z-index
opacity	   :int				: opacity
} ,
"scroller" :{
	  "style": { ... },
	  "styleover": { ... },
	  "up":url, "down":url,
	  "height":int,		//scroller's height
  	  "step":int,		//step to scroll by
	  "time":int,		//pause in milliseconds
	  "len":int,            //length in pixels to scroll 
          "offset": int         //if scroller size smaller 
				//that bar size set margin from the left side
          }	// describes the scrollers set
]

Read more about CodeThatXPBar >>