menu tab com imagens

[programador php 0]

galera!!!

seguinte esse codigo que esta ai monta um menu,

juntei ele..vindo do css do maujor!!! e do dhtml goodies

 

gostaria que o menu da direita, aquela bordinha ficasse da mesma cor

 

segue o link das imagens

 

http://www.maujor.com/tutorial/apoio_slidi.../v2/left_on.gif

http://www.maujor.com/tutorial/apoio_slidi...oor/v2/left.gif

http://www.maujor.com/tutorial/apoio_slidi...v2/right_on.gif

http://www.maujor.com/tutorial/apoio_slidi...or/v2/right.gif

http://www.maujor.com/tutorial/apoio_sliding-door/v2/bg.gif

 

 

 

<style type="text/css">body {  background:#fff;  margin:0;  padding:0;  color:#000;  font:x-small Verdana, sans-serif;  voice-family: "\"}\""; voice-family:inherit;  font-size:small;  } html>body {font-size:small;}#mainMenu {  float:left;  width:100%;  background:#369 url(bg.gif) repeat-x bottom;  font-size:85%;  line-height:normal;  }#mainMenu ul {  margin:0;  padding:10px 10px 0;  list-style:none;  }#mainMenu li {  float:left;  background:url(right.gif) no-repeat right top;  margin:0;  padding:0 5px 0 0;  }#mainMenu a {  float:left;  display:block;  background:url(left.gif) no-repeat left top;  padding:5px 7px 4px 20px;  text-decoration:none;  font-weight:bold;  color:#9cf;  }/* Commented Backslash Hack   hides rule from IE5-Mac \*/#mainMenu a {float:none;}/* End IE5-Mac hack */#mainMenu a:hover {  color:#fff;  }#mainMenu #current {  background-image:url(right_on.gif);  }#mainMenu #current a {  background-image:url(left_on.gif);  color:#333;  padding-bottom:5px;  }    #mainMenu .activeMenuItem {	background-image:url(left_on.gif);  }   .activeMenuItem1 {	background-image:url(right_on.gif);  }    	</style>	<script type="text/javascript">	/**********************************************************************************************		Copyright (c) 2005 - Alf Magne Kalleland post@dhtmlgoodies.com		Get this and other scripts at www.dhtmlgoodies.com		You can use this script freely as long as this copyright message is kept intact.		**********************************************************************************************/	var menuAlignment = 'left';	// Align menu to the left or right?			var topMenuSpacer = 0; // Horizontal space(pixels) between the main menu items		var activateSubOnClick = false; // if true-> Show sub menu items on click, if false, show submenu items onmouseover	var leftAlignSubItems = false; 	// left align sub items t		var activeMenuItem = false;	// Don't change this option. It should initially be false	var activeTabIndex = 0;	// Index of initial active tab	(0 = first tab) - If the value below is set to true, it will override this one.	var rememberActiveTabByCookie = true;	// Set it to true if you want to be able to save active tab as cookie		var lista = document.getElementsByTagName("LI");		var MSIE = navigator.userAgent.indexOf('MSIE')>=0?true:false;	var Opera = navigator.userAgent.indexOf('Opera')>=0?true:false;	var navigatorVersion = navigator.appVersion.replace(/.*?MSIE ([0-9]\.[0-9]).*/g,'$1')/1;			/*	These cookie functions are downloaded from 	http://www.mach5.com/support/analyzer/manual/html/General/CookiesJavaScript.htm	*/		function Get_Cookie(name) { 	   var start = document.cookie.indexOf(name+"="); 	   var len = start+name.length+1; 	   if ((!start) && (name != document.cookie.substring(0,name.length))) return null; 	   if (start == -1) return null; 	   var end = document.cookie.indexOf(";",len); 	   if (end == -1) end = document.cookie.length; 	   return unescape(document.cookie.substring(len,end)); 	} 	// This function has been slightly modified	function Set_Cookie(name,value,expires,path,domain,secure) { 		expires = expires * 60*60*24*1000;		var today = new Date();		var expires_date = new Date( today.getTime() + (expires) );		var cookieString = name + "=" +escape(value) + 		   ( (expires) ? ";expires=" + expires_date.toGMTString() : "") + 		   ( (path) ? ";path=" + path : "") + 		   ( (domain) ? ";domain=" + domain : "") + 		   ( (secure) ? ";secure" : ""); 		document.cookie = cookieString; 	}			function showHide()	{		if(activeMenuItem){			activeMenuItem.className = 'inactiveMenuItem'; 				var theId = activeMenuItem.id.replace(/[^0-9]/g,'');			document.getElementById('submenu_'+theId).style.display='none';			var img = activeMenuItem.getElementsByTagName('IMG');			if(img.length>0)img[0].style.display='none';			this.className = 'inactiveMenuItem'; 					}		var img = this.getElementsByTagName('IMG');		if(img.length>0)img[0].style.display='inline';						activeMenuItem = this;				this.className = 'activeMenuItem';		lista.className = 'activeMenuItem1'; 				var theId = this.id.replace(/[^0-9]/g,'');		document.getElementById('submenu_'+theId).style.display='block';								if(rememberActiveTabByCookie){			Set_Cookie('dhtmlgoodies_tab_menu_tabIndex','index: ' + (theId-1),100);		}	}		function initMenu()	{		var mainMenuObj = document.getElementById('mainMenu');		var menuItems = mainMenuObj.getElementsByTagName('A');		if(document.all){			mainMenuObj.style.visibility = 'hidden';			document.getElementById('submenu').style.visibility='hidden';		}				if(rememberActiveTabByCookie){			var cookieValue = Get_Cookie('dhtmlgoodies_tab_menu_tabIndex') + '';			cookieValue = cookieValue.replace(/[^0-9]/g,'');			if(cookieValue.length>0 && cookieValue<menuItems.length){				activeTabIndex = cookieValue/1;			}					}				var currentLeftPos = 15;		for(var no=0;no<menuItems.length;no++){						if(activateSubOnClick)menuItems[no].onclick = showHide; else menuItems[no].onclick = showHide;			menuItems[no].id = 'mainMenuItem' + (no+1);			if(menuAlignment=='left')				menuItems[no].style.left = currentLeftPos + 'px';			else				menuItems[no].style.right = currentLeftPos + 'px';			currentLeftPos = currentLeftPos + menuItems[no].offsetWidth + topMenuSpacer; 						var img = menuItems[no].getElementsByTagName('IMG');			if(img.length>0){				img[0].style.display='none';				if(MSIE && !Opera && navigatorVersion<7){					img[0].style.bottom = '-1px';					img[0].style.right = '-1px';				}			}									if(no==activeTabIndex){				menuItems[no].className='activeMenuItem';				activeMenuItem = menuItems[no];				var img = activeMenuItem.getElementsByTagName('IMG');				if(img.length>0)img[0].style.display='inline';											}else menuItems[no].className='inactiveMenuItem';			if(!document.all)menuItems[no].style.bottom = '-1px';			if(MSIE && navigatorVersion < 6)menuItems[no].style.bottom = '-2px';					}						var mainMenuLinks = mainMenuObj.getElementsByTagName('A');				var subCounter = 1;		var parentWidth = mainMenuObj.offsetWidth;		while(document.getElementById('submenu_' + subCounter)){			var subItem = document.getElementById('submenu_' + subCounter);						if(leftAlignSubItems){				// No action			}else{											var leftPos = mainMenuLinks[subCounter-1].offsetLeft;				//document.getElementById('submenu_'+subCounter).style.paddingLeft =  leftPos + 'px';				subItem.style.position ='absolute';				if(subItem.offsetWidth > parentWidth){					leftPos = leftPos - Math.max(0,subItem.offsetWidth-parentWidth); 					}				//subItem.style.paddingLeft =  leftPos + 'px';				subItem.style.position ='static';												}			if(subCounter==(activeTabIndex+1)){				subItem.style.display='block';			}else{				subItem.style.display='none';			}						subCounter++;		}		if(document.all){			mainMenuObj.style.visibility = 'visible';			document.getElementById('submenu').style.visibility='visible';		}				document.getElementById('submenu').style.display='block';	}	window.onload = initMenu;		</script>	<!-- This is the start of the menu --><div id="mainMenu">	<ul>		<li><a>Products</a></li>		<li><a>Support</a></li>		<li><a>About us</a></li>		<li><a>Download</a></li>	</ul></div><div id="submenu">	<!-- The first sub menu -->	<div id="submenu_1">		<a href="http://www.dhtmlgoodies.com">Product 1</a>		<a href="http://www.dhtmlgoodies.com">Product 2</a>		<a href="http://www.dhtmlgoodies.com">Product 3</a>	</div>	<!-- Second sub menu -->	<div id="submenu_2">		<a href="http://www.dhtmlgoodies.com">Phone</a>		<a href="http://www.dhtmlgoodies.com">Email</a>		<a href="http://www.dhtmlgoodies.com">Knowledge base</a>	</div>	<!-- Third sub menu -->	<div id="submenu_3">		<a href="http://www.dhtmlgoodies.com">History</a>		<a href="http://www.dhtmlgoodies.com">The team</a>		<a href="http://www.dhtmlgoodies.com">Contact us</a>		<a href="http://www.dhtmlgoodies.com">Visions</a>	</div>	<!-- Fourth sub menu -->	<div id="submenu_4">		<a href="http://www.dhtmlgoodies.com">Patches</a>		<a href="http://www.dhtmlgoodies.com">Whitepapers</a>		<a href="http://www.dhtmlgoodies.com">Tab menu</a>		<a href="http://www.dhtmlgoodies.com">Color picker</a>		<a href="http://www.dhtmlgoodies.com">Window scripts</a>		<a href="http://www.dhtmlgoodies.com">Games</a>	</div></div>

estou desde a manha para fazer isso e não consigo

 

espero que possam me ajudar

 

abraço

[programador php 0]

problema contornado

 

http://forum.imasters.com.br/index.php?sho...186179&st=0

 

abraço