Fully customizable actionbar on the Web

Don't you hate that non-customizable actionbar?

Don't you hate that non-customizable actionbar? With this tip, you can place your actionbar wherever you want, in what colour you want and whatever site you want.


Just put this in the onLoad event of the form:

STEP 1:

var oTable = document.forms[0].children[0];
if (oTable && oTable.tagName== "TABLE")   {
		document.forms[0].children[0].className = "actionBar";
	};

This little piece of code checks if there is an actionbar, and if so, it assigns a class to the table.

STEP 2: Put this in the HTML HEAD or create an external css file:

Table.actionBar {
	font-size 			: 95%;
    background:		rgb(120,172,255);
    width: 100%;
	border-collapse 		: collapse;
	margin 				: 20px 15px 20px;
	border 				: 1px solid;
    margin:60px 0px 10px 0px;
	padding: 17px 0px 0px 20px;
	height:33px; /* 14px + 17px + 2px = 33px */
	border-color:black;
	border-width:1px  1px; /* top and bottom borders: 1px; left and right borders: 0px */
	line-height:11px;
}

Table.actionBar a, Table.actionBar a:visited {
	color:				black;
	border:				1px solid rgb(120,172,255);/*rgb(255,128,0);*/
	text-decoration:	none;
	padding:			1px;
	padding-left:		5px;
	padding-right:		5px;
}

.actionBar TD,Table.actionBar a:hover {
	color:			black;
	background:		rgb(120,172,255);
	border-left:	1px solid rgb(234,242,255);/*#ffcc88;*/
	border-right:	1px solid rgb(0,66,174);/*#884400;*/
	border-top:		1px solid rgb(234,242,255);/*#ffcc88;*/
	border-bottom:	1px solid rgb(0,66,174);/*#884400;*/
}

hr{width:0px}

If you want another color, just change the values. Have fun with it.

This was first published in September 2001
This Content Component encountered an error

0 comments

Oldest 

Forgot Password?

No problem! Submit your e-mail address below. We'll send you an email containing your password.

Your password has been sent to:

-ADS BY GOOGLE

SearchWinIT

Search400

  • iSeries tutorials

    Search400.com's tutorials provide in-depth information on the iSeries. Our iSeries tutorials address areas you need to know about...

  • V6R1 upgrade planning checklist

    When upgrading to V6R1, make sure your software will be supported, your programs will function and the correct PTFs have been ...

  • Connecting multiple iSeries systems through DDM

    Working with databases over multiple iSeries systems can be simple when remotely connecting logical partitions with distributed ...

SearchEnterpriseLinux

SearchVirtualDataCentre.co.UK

Close