CodeThat.com

CodeThatXPBar - The main style properties Example

var BarDef =
{
	"style"	 : {
		"css"	 : "bartitle2",
		"align" : "center",
		"bgcolor" : "#768AAB",
		"size"	 : [160, 25],
		"shadow" : {
			"color" : "#C0C0C0", "width" : 1
		},
		"imgspace" : 5,
		"imgendon" : {
			"src" : "img/arr_down_2.gif",
			"width" : 13, "height" : 12
		},
		"imgendoff" : {
			"src" : "img/arr_up_2.gif",
			"width" : 13, "height" : 12
		},
		"itemoffset" : {
			"x" : 5, "y" : 10
		},
		"fixheight" : 250,
		"scroller" : {
			"height" : 25, "bgcolor" : "#ECE9D8",
			"color" : "#000000",
			"up" : "img/arr_up_2.gif",
			"down" : "img/arr_down_2.gif",
			"step" : 5, "time" : 30, "len" : 60
		}
	},
	"itemover" : {
		"css" : "bartitle2",
		"size"	 : [160, 25],
		"bgimg" : "img/bg2.gif"
	},
	"itemon" : {
		"bgimg" : "img/bg2.gif", "color" : "#000000"
	},
	"position" : {
		"absolute" : true, "pos" : [10, 10]
	},
	"items" : [
	{
		"text" : "Main",
		"style" : {
			"bgimg" : "img/bg2.gif",
			"imgdir" : {
				"src" : "img/home.gif",
				"width" : 24, "height" : 24
			}
		},
		"menu" : {
			"style" : {
				"css"	 : "bartext2",
				"size" : [150, 22],
				"bgcolor" : "#D8DEE7",
				"bgimg" : "",
				"itemoffset" : {
					"x" : 5, "y" : 2
				}
			},
			"itemover" : {
				"imgendon" : { },
				"imgendoff" : { },
				"bgimg" : "",
				"size" : [150, 22]
			},
			"items"	 : [
			{
				"text" : "My Computer",
				"style" :
				{
					"imgitem" : {
						"src" : "img/computer.gif",
						"width" : 16, "height" : 16
					}
				},
				"action" : {
					"js" : "openWin(30, 30);"
				}
			},
			{
				"text" : "Printer",
				"style" :
				{
					"imgitem" : {
						"src" : "img/print.gif",
						"width" : 16, "height" : 16
					}
				},
				"action" : {
					"js" : "openWin(30, 30);"
				}
			} ]
		}
	},
	{
		"text" : "Favorites",
		"style" : {
			"bgimg" : "img/bg2.gif",
			"imgdir" : {
				"src" : "img/fav.gif",
				"width" : 24, "height" : 24
			}
		},
		"menu" : {
			"style" : {
				"css"	 : "bartext2",
				"size" : [150, 22],
				"bgcolor" : "#D8DEE7",
				"bgimg" : "",
				"itemoffset" : {
					"x" : 5, "y" : 2
				}
			},
			"itemover" : {
				"imgendon" : { },
				"imgendoff" : { },
				"bgimg" : "",
				"size" : [150, 22]
			},
			"items"	 : [
			{
				"text" : "Microsoft.com :)",
				"style" :
				{
					"imgitem" : {
						"src" : "img/fav2.gif",
						"width" : 16, "height" : 16
					}
				},
				"action" : {
					"url" : "http://www.microsoft.com",
					"target" : "_blank", "title" : "Google"
				}
			},
			{
				"text" : "ICQ.com",
				"style" :
				{
					"imgitem" : {
						"src" : "img/fav2.gif",
						"width" : 16, "height" : 16
					}
				},
				"action" : {
					"url" : "http://www.icq.com",
					"target" : "_blank", "title" : "Google"
				}
			} ]
		}
	},
	{
		"text" : "Search",
		"style" : {
			"bgimg" : "img/bg2.gif",
			"imgdir" : {
				"src" : "img/search.gif",
				"width" : 24, "height" : 24
			}
		},
		"menu" : {
			"style" : {
				"css"	 : "bartext2",
				"size" : [150, 22],
				"bgcolor" : "#D8DEE7",
				"bgimg" : "",
				"itemoffset" : {
					"x" : 5, "y" : 2
				}
			},
			"itemover" : {
				"imgendon" : { },
				"imgendoff" : { },
				"bgimg" : "",
				"size" : [150, 22]
			},
			"items"	 : [
			{
				"text" : "Google Search",
				"style" :
				{
					"imgitem" : {
						"src" : "img/search2.gif",
						"width" : 16, "height" : 16
					}
				},
				"action" : {
					"url" : "http://www.google.com",
					"target" : "_blank", "title" : "Google"
				}
			},
			{
				"text" : "Yahoo",
				"style" :
				{
					"imgitem" : {
						"src" : "img/search2.gif",
						"width" : 16, "height" : 16
					}
				},
				"action" : {
					"url" : "http://yahoo.com",
					"target" : "_blank", "title" : "Yahoo!!!!"
				}
			} ]
		}
	} ]
};