Avatar of AxISQS
AxISQS
 asked on

Highlight link when active - using Javascript and DHTML

Hello everyone.  I have a page that seems to be working great with one problem.  At the top of the page are a few links.  When you click each link a JS function hides or displays a table contained within <div>.  When you're active on a link the active link is not highlighted.  Please see my screenshot for more information.  The code can be found below.  Can you help troubleshoot why this is occurring?  Thanks!


working
not working

<style>
a:visited{
  color:#494949;
}
.chromemenu{
width: 99%;
font-weight: bold;
}

.chromemenu:after{ /*Add margin between menu and rest of content in Firefox*/
content: "."; 
display: block; 
height: 0; 
clear: both; 
visibility: hidden;
}

.chromemenu ul{
border: 1px solid #BBB;
width: 100%;
background: url(/img/vcmcustomview/chromebg.gif) center center repeat-x;
padding: 5px 0;
margin: 0;
text-align: left; /*set value to "right" for example to align menu to the left of page*/
}

.chromemenu ul li{
display: inline;
}

.chromemenu ul li a{
color: #494949;
padding: 5px 8px;
margin: 0;
text-decoration: none;
border-right: 1px solid #BBB;
}

.chromemenu ul li a:hover, .chromemenu ul li a.current{
background: url(/img/vcmcustomview/chromebg2.gif) center center repeat-x;
}

.tabcontainer{
clear: left;
width:95%; /*width of 2nd level sub menus*/
height:1.5em; /*height of 2nd level sub menus. Set to largest's sub menu's height to avoid jittering.*/
}

.tabcontainer{font-family:"Lucida Grande","Lucida Sans Unicode", Tahoma, sans-serif;letter-spacing:.01em}.tabcontainer li ul{width:64%}

.tabcontent{
display:none;
}
</style>

<script>

//DD Tab Menu- Script rewritten April 27th, 07: http://www.dynamicdrive.com
//**Updated Feb 23rd, 08): Adds ability for menu to revert back to default selected tab when mouse moves out of menu

//Only 2 configuration variables below:

var ddtabmenu={
	disabletablinks: false, //Disable hyperlinks in 1st level tabs with sub contents (true or false)?
	snap2original: [true, 300], //Should tab revert back to default selected when mouse moves out of menu? ([true/false, delay_millisec]

	currentpageurl: window.location.href.replace("http://"+window.location.hostname, "").replace(/^\//, ""), //get current page url (minus hostname, ie: http://www.dynamicdrive.com/)

definemenu:function(tabid, dselected){
	this[tabid+"-menuitems"]=null
	this[tabid+"-dselected"]=-1
	this.addEvent(window, function(){ddtabmenu.init(tabid, dselected)}, "load")
},

showsubmenu:function(tabid, targetitem){
	var menuitems=this[tabid+"-menuitems"]
	this.clearrevert2default(tabid)
 for (i=0; i<menuitems.length; i++){
		menuitems[i].className=""
		if (typeof menuitems[i].hasSubContent!="undefined")
			document.getElementById(menuitems[i].getAttribute("rel")).style.display="none"
	}
	targetitem.className="current"
	if (typeof targetitem.hasSubContent!="undefined")
		document.getElementById(targetitem.getAttribute("rel")).style.display="block"
},

isSelected:function(menuurl){
	var menuurl=menuurl.replace("http://"+menuurl.hostname, "").replace(/^\//, "")
	return (ddtabmenu.currentpageurl==menuurl)
},

isContained:function(m, e){
	var e=window.event || e
	var c=e.relatedTarget || ((e.type=="mouseover")? e.fromElement : e.toElement)
	while (c && c!=m)try {c=c.parentNode} catch(e){c=m}
	if (c==m)
		return true
	else
		return false
},

revert2default:function(outobj, tabid, e){
	if (!ddtabmenu.isContained(outobj, tabid, e)){
		window["hidetimer_"+tabid]=setTimeout(function(){
			ddtabmenu.showsubmenu(tabid, ddtabmenu[tabid+"-dselected"])
		}, ddtabmenu.snap2original[1])
	}
},

clearrevert2default:function(tabid){
 if (typeof window["hidetimer_"+tabid]!="undefined")
		clearTimeout(window["hidetimer_"+tabid])
},

addEvent:function(target, functionref, tasktype){ //assign a function to execute to an event handler (ie: onunload)
	var tasktype=(window.addEventListener)? tasktype : "on"+tasktype
	if (target.addEventListener)
		target.addEventListener(tasktype, functionref, false)
	else if (target.attachEvent)
		target.attachEvent(tasktype, functionref)
},

init:function(tabid, dselected){
	var menuitems=document.getElementById(tabid).getElementsByTagName("a")
	this[tabid+"-menuitems"]=menuitems
	for (var x=0; x<menuitems.length; x++){
		if (menuitems[x].getAttribute("rel")){
			this[tabid+"-menuitems"][x].hasSubContent=true
			if (ddtabmenu.disabletablinks)
				menuitems[x].onclick=function(){return false}
			if (ddtabmenu.snap2original[0]==true){
				var submenu=document.getElementById(menuitems[x].getAttribute("rel"))
				menuitems[x].onmouseout=function(e){ddtabmenu.revert2default(submenu, tabid, e)}
				submenu.onmouseover=function(){ddtabmenu.clearrevert2default(tabid)}
				submenu.onmouseout=function(e){ddtabmenu.revert2default(this, tabid, e)}
			}
		}
		else //for items without a submenu, add onMouseout effect
			menuitems[x].onmouseout=function(e){this.className=""; if (ddtabmenu.snap2original[0]==true) ddtabmenu.revert2default(this, tabid, e)}
		menuitems[x].onmouseover=function(){ddtabmenu.showsubmenu(tabid, this)}
		if (dselected=="auto" && typeof setalready=="undefined" && this.isSelected(menuitems[x].href)){
			ddtabmenu.showsubmenu(tabid, menuitems[x])
			this[tabid+"-dselected"]=menuitems[x]
			var setalready=true
		}
		else if (parseInt(dselected)==x){
			ddtabmenu.showsubmenu(tabid, menuitems[x])
			this[tabid+"-dselected"]=menuitems[x]
		}
	}
}
}

</script>

<script type="text/javascript">

ddtabmenu.definemenu("ddtabs5", 0) //initialize Tab Menu #5 with NO tabs selected 

</script>

<form name="navForm">
    <input type="hidden" ID="cu" Name="cu" value="kristi test" />
    <input type="hidden" ID="cuID" Name="cuID" value="kristi test ID" />

<div id="ddtabs5" class="chromemenu">
<ul>
<li>
<a onclick="javascript:this.className='current';document.getElementById('megaprocessSection').style.display='block';document.getElementById('doctypeSection').style.display='none';document.getElementById('reportsSection').style.display='none';document.getElementById('helpSection').style.display='none';"><span style="cursor:pointer">Mega Process</span></a>
</li>
<li>
<a onclick="javascript:this.className='current';document.getElementById('megaprocessSection').style.display='none';document.getElementById('doctypeSection').style.display='block';document.getElementById('reportsSection').style.display='none';document.getElementById('helpSection').style.display='none';"><span style="cursor:pointer">Document Type</span></a>
</li>
<li>
<a onclick="javascript:this.className='current';document.getElementById('megaprocessSection').style.display='none';document.getElementById('doctypeSection').style.display='none';document.getElementById('reportsSection').style.display='block';document.getElementById('helpSection').style.display='none';"><span style="cursor:pointer">Reports</span></a>
</li>
<li>
<a onclick="#"><span style="cursor:pointer">Help</span></a>
</li>
<li>
<a href="javascript:document.getElementById('cu').value=currentUser.userName;document.getElementById('cuID').value=currentUser.id;void(window.open('{ot:OTvar_livelink_cgiPath}/open/PDMSRequestForm_REQ','',''));"><span style="cursor:pointer">New Document</span></a>
</li>
</ul>
</div>
<br />
<div class="ddcolortabsline"></div>
<div class="tabcontainer">

<div id="megaprocessSection" style="display:block">
<table border="0" align="center" cellpadding="8" cellspacing="20">
  <tr>
    <td>
    <p style="text-align: center" align="center"><a href="#" onclick="FacetPanel.facetRun(1956049,'Customer Acquisition');return false" title="Apply filter of Mega Process: Customer Acquisition"><img height="85" border="0" src="/img/pdms_cv/images/customer_aquisition.png"></a><br />
      <br />
      Customer Acquisition</p>
    </td>
    <td>
    <p style="text-align: center" align="center"><a href="#" onclick="FacetPanel.facetRun(1956049,'Enabling Communications');return false" title="Apply filter of Mega Process: Enabling Communications"><img height="85" border="0" src="/img/pdms_cv/images/enabling_communications.png"></a><br />
      <br />
      Enabling Communications</p>
    </td>
    <td>
    <p style="text-align: center" align="center"><a href="#" onclick="FacetPanel.facetRun(1956049,'Enabling Enterprise Effectiveness');return false" title="Apply filter of Mega Process: Enabling Enterprise Effectiveness"><img height="85" border="0" src="/img/pdms_cv/images/enabling_ent_effectiveness.png"></a><br />
      <br />
      Enabling Enterprise Effectiveness</p>
    </td>
    <td>
    <p style="text-align: center" align="center"><a href="#" onclick="FacetPanel.facetRun(1956049,'Enabling Financial Accounting and Reporting');return false" title="Apply filter of Mega Process: Enabling Financial Accounting and Reporting"><img height="85" border="0" src="/img/pdms_cv/images/enabling_fin_acct_rept.png"></a><br />
      <br />
      Enabling Financial Accounting and Reporting</p>
    </td>
    <td>
    <p style="text-align: center" align="center"><a href="#" onclick="FacetPanel.facetRun(1956049,'Enabling IT Optimization');return false" title="Apply filter of Mega Process: Enabling IT Optimization"><img height="85" border="0" src="/img/pdms_cv/images/enabling_it_optimization.png"></a><br />
      <br />
      Enabling IT Optimization</p>
    </td>
  	<td>
    <p style="text-align: center" align="center"><a href="#" onclick="FacetPanel.facetRun(1956049,'Enabling Human Resource Management');return false" title="Apply filter of Mega Process: Enabling Human Resource Management"><img height="85" border="0" src="/img/pdms_cv/images/enabling_resource_mgmt.png"></a><br />
      <br />
      Enabling Human Resource Management</p>
    </td>
    <td>
    <p style="text-align: center" align="center"><a href="#" onclick="FacetPanel.facetRun(1956049,'Responsible Care and Sustainability');return false" title="Apply filter of Mega Process: Responsible Care and Sustainability"><img height="85" border="0" src="/img/pdms_cv/images/responsible_care_sust.png"></a><br />
      <br />
      Responsible Care and Sustainability</p>
    </td>
  </tr>
  </table>
  
  <table border="0" align="center" cellpadding="8" cellspacing="20">
  <tr align="center">
      <td>
    <p style="text-align: center" align="center"><a href="#" onclick="FacetPanel.facetRun(1956049,'Governing Ethics and Compliance');return false" title="Apply filter of Mega Process: Governing Ethics and Compliance"><img height="85" border="0" src="/img/pdms_cv/images/governing_ethics_compliance.png"></a><br />
      <br />
      Governing Ethics and Compliance</p>
    </td>
    <td>
    <p style="text-align: center" align="center"><a href="#" onclick="FacetPanel.facetRun(1956049,'New Solutions Development');return false" title="Apply filter of Mega Process: New Solutions Development"><img height="85" border="0" src="/img/pdms_cv/images/new_solutions_dev.png"></a><br />
      <br />
      New Solutions Development</p>
    </td>
    <td>
    <p style="text-align: center" align="center"><a href="#" onclick="FacetPanel.facetRun(1956049,'Supply Chain - Global Trade Management');return false" title="Apply filter of Mega Process: Supply Chain - Global Trade Management"><img height="85" border="0" src="/img/pdms_cv/images/supplychain_global_trade_mgmt.png"></a><br />
      <br />
      Supply Chain - Global Trade Management</p>
    </td>
    <td>
    <p style="text-align: center" align="center"><a href="#" onclick="FacetPanel.facetRun(1956049,'Supply Chain - Order to Cash');return false" title="Apply filter of Mega Process: Supply Chain - Order to Cash"><img height="85" border="0" src="/img/pdms_cv/images/supplychain_order_cash.png"></a><br />
      <br />
      Supply Chain - Order to Cash</p>
    </td>
    <td>
    <p style="text-align: center" align="center"><a href="#" onclick="FacetPanel.facetRun(1956049,'Supply Chain - Plan to Deliver');return false" title="Apply filter of Mega Process: Supply Chain - Plan to Deliver"><img height="85" border="0" src="/img/pdms_cv/images/supplychain_plan_deliver.png"></a><br />
      <br />
      Supply Chain - Plan to Deliver</p>
    </td>
  	<td>
    <p style="text-align: center" align="center"><a href="#" onclick="FacetPanel.facetRun(1956049,'Supply Chain - Source to Pay');return false" title="Apply filter of Mega Process: Supply Chain - Source to Pay"><img height="85" border="0" src="/img/pdms_cv/images/supplychain_source_pay.png"></a><br />
      <br />
      Supply Chain - Source to Pay</p>
    </td>
  </tr>
</table>
</div>

<div id="doctypeSection" style="display:none">
<table border="0" align="center" cellpadding="8" cellspacing="20">
  <tr>
    <td>
    <p style="text-align: center" align="center"><a href="{ot:OTvar_livelink_cgiPath}/open/Corporate_Policy"><img border="0" src="/img/pdms_cv/images/policy.png"  height="80px" alt=""></a><br />
      <br />
      Corporate Policy</p>
    </td>
    <td>
    <p style="text-align: center" align="center"><a href="{ot:OTvar_livelink_cgiPath}/open/Form"><img border="0" src="/img/pdms_cv/images/form.png"  height="80px" alt=""></a><br />
      <br />
      Form</p>
    </td>
    <td>
    <p style="text-align: center" align="center"><a href="{ot:OTvar_livelink_cgiPath}/open/Group_Policy"><img border="0" src="/img/pdms_cv/images/policy.png"  height="80px" alt=""></a><br />
      <br />
      Group Policy</p>
    </td>
    <td>
    <p style="text-align: center" align="center"><a href="{ot:OTvar_livelink_cgiPath}/open/Presentation"><img border="0" src="/img/pdms_cv/images/presentation.png"  height="80px" alt=""></a><br />
      <br />
      Presentation</p>
    </td>
    <td>
    <p style="text-align: center" align="center"><a href="{ot:OTvar_livelink_cgiPath}/open/Procedure"><img border="0" src="/img/pdms_cv/images/procedure.png"  height="80px" alt=""></a><br />
      <br />
      Procedure</p>
    </td>
  	<td>
    <p style="text-align: center" align="center"><a href="{ot:OTvar_livelink_cgiPath}/open/Program_Plan_Manual"><img border="0" src="/img/pdms_cv/images/program.png"  height="80px" alt=""></a><br />
      <br />
      Program/Plan/Manual</p>
    </td>
    <td>
    <p style="text-align: center" align="center"><a href="{ot:OTvar_livelink_cgiPath}/open/Reference"><img border="0" src="/img/pdms_cv/images/reference.png"  height="80px" alt=""></a><br />
      <br />
      Reference</p>
    </td>
    <td>
    <p style="text-align: center" align="center"><a href="{ot:OTvar_livelink_cgiPath}/open/Training"><img border="0" src="/img/pdms_cv/images/training.png"  height="80px" alt=""></a><br />
      <br />
      Training</p>
    </td>
    <td>
    <p style="text-align: center" align="center"><a href="{ot:OTvar_livelink_cgiPath}/open/Work_Instruction"><img border="0" src="/img/pdms_cv/images/work.png"  height="80px" alt=""></a><br />
      <br />
      Work Instruction</p>
    </td>
  </tr>
</table>
</div>


<div id="reportsSection" style="display:none">
<table border="0" align="center" cellpadding="8" cellspacing="20">
  <tr>
    <td>
    <p style="text-align: center" align="center"><a href="#"><img border="0" src="/img/pdms_cv/images/document_management.png"  height="80px" alt=""></a><br />
      <br />
      Placeholder</p>
    </td>
    <td>
    <p style="text-align: center" align="center"><a href="#"><img border="0" src="/img/pdms_cv/images/archiving.png"  height="80px" alt=""></a><br />
      <br />
      Placeholder</p>
    </td>
    <td>
    <p style="text-align: center" align="center"><a href="#"><img border="0" src="/img/pdms_cv/images/records_management.png"  height="80px" alt=""></a><br />
      <br />
      Placeholder</p>
    </td>
    <td>
    <p style="text-align: center" align="center"><a href="#"><img border="0" src="/img/pdms_cv/images/formsandworkflow.png"  height="80px" alt=""></a><br />
      <br />
      Placeholder</p>
    </td>
  </tr>
</table>
</div>

</div>
</form>

Open in new window

JavaScriptHTMLWeb Development

Avatar of undefined
Last Comment
Michel Plungjan

8/22/2022 - Mon
Michel Plungjan

You do not have a

helpSection

Delete this statement

document.getElementById('helpSection').style.display='none'

from the links or add the helpSection
AxISQS

ASKER
@mplungjan, excellent idea.  I removed document.getElementById('helpSection').style.display='none'

...however, the problem still exists.  Please see my code.  Thanks for your time!

<style>
a:visited{
  color:#494949;
}
.chromemenu{
width: 99%;
font-weight: bold;
}

.chromemenu:after{ /*Add margin between menu and rest of content in Firefox*/
content: "."; 
display: block; 
height: 0; 
clear: both; 
visibility: hidden;
}

.chromemenu ul{
border: 1px solid #BBB;
width: 100%;
background: url(/img/vcmcustomview/chromebg.gif) center center repeat-x;
padding: 5px 0;
margin: 0;
text-align: left; /*set value to "right" for example to align menu to the left of page*/
}

.chromemenu ul li{
display: inline;
}

.chromemenu ul li a{
color: #494949;
padding: 5px 8px;
margin: 0;
text-decoration: none;
border-right: 1px solid #BBB;
}

.chromemenu ul li a:hover, .chromemenu ul li a.current{
background: url(/img/vcmcustomview/chromebg2.gif) center center repeat-x;
}

.tabcontainer{
clear: left;
width:95%; /*width of 2nd level sub menus*/
height:1.5em; /*height of 2nd level sub menus. Set to largest's sub menu's height to avoid jittering.*/
}

.tabcontainer{font-family:"Lucida Grande","Lucida Sans Unicode", Tahoma, sans-serif;letter-spacing:.01em}.tabcontainer li ul{width:64%}

.tabcontent{
display:none;
}
</style>

<script>

//DD Tab Menu- Script rewritten April 27th, 07: http://www.dynamicdrive.com
//**Updated Feb 23rd, 08): Adds ability for menu to revert back to default selected tab when mouse moves out of menu

//Only 2 configuration variables below:

var ddtabmenu={
	disabletablinks: false, //Disable hyperlinks in 1st level tabs with sub contents (true or false)?
	snap2original: [true, 300], //Should tab revert back to default selected when mouse moves out of menu? ([true/false, delay_millisec]

	currentpageurl: window.location.href.replace("http://"+window.location.hostname, "").replace(/^\//, ""), //get current page url (minus hostname, ie: http://www.dynamicdrive.com/)

definemenu:function(tabid, dselected){
	this[tabid+"-menuitems"]=null
	this[tabid+"-dselected"]=-1
	this.addEvent(window, function(){ddtabmenu.init(tabid, dselected)}, "load")
},

showsubmenu:function(tabid, targetitem){
	var menuitems=this[tabid+"-menuitems"]
	this.clearrevert2default(tabid)
 for (i=0; i<menuitems.length; i++){
		menuitems[i].className=""
		if (typeof menuitems[i].hasSubContent!="undefined")
			document.getElementById(menuitems[i].getAttribute("rel")).style.display="none"
	}
	targetitem.className="current"
	if (typeof targetitem.hasSubContent!="undefined")
		document.getElementById(targetitem.getAttribute("rel")).style.display="block"
},

isSelected:function(menuurl){
	var menuurl=menuurl.replace("http://"+menuurl.hostname, "").replace(/^\//, "")
	return (ddtabmenu.currentpageurl==menuurl)
},

isContained:function(m, e){
	var e=window.event || e
	var c=e.relatedTarget || ((e.type=="mouseover")? e.fromElement : e.toElement)
	while (c && c!=m)try {c=c.parentNode} catch(e){c=m}
	if (c==m)
		return true
	else
		return false
},

revert2default:function(outobj, tabid, e){
	if (!ddtabmenu.isContained(outobj, tabid, e)){
		window["hidetimer_"+tabid]=setTimeout(function(){
			ddtabmenu.showsubmenu(tabid, ddtabmenu[tabid+"-dselected"])
		}, ddtabmenu.snap2original[1])
	}
},

clearrevert2default:function(tabid){
 if (typeof window["hidetimer_"+tabid]!="undefined")
		clearTimeout(window["hidetimer_"+tabid])
},

addEvent:function(target, functionref, tasktype){ //assign a function to execute to an event handler (ie: onunload)
	var tasktype=(window.addEventListener)? tasktype : "on"+tasktype
	if (target.addEventListener)
		target.addEventListener(tasktype, functionref, false)
	else if (target.attachEvent)
		target.attachEvent(tasktype, functionref)
},

init:function(tabid, dselected){
	var menuitems=document.getElementById(tabid).getElementsByTagName("a")
	this[tabid+"-menuitems"]=menuitems
	for (var x=0; x<menuitems.length; x++){
		if (menuitems[x].getAttribute("rel")){
			this[tabid+"-menuitems"][x].hasSubContent=true
			if (ddtabmenu.disabletablinks)
				menuitems[x].onclick=function(){return false}
			if (ddtabmenu.snap2original[0]==true){
				var submenu=document.getElementById(menuitems[x].getAttribute("rel"))
				menuitems[x].onmouseout=function(e){ddtabmenu.revert2default(submenu, tabid, e)}
				submenu.onmouseover=function(){ddtabmenu.clearrevert2default(tabid)}
				submenu.onmouseout=function(e){ddtabmenu.revert2default(this, tabid, e)}
			}
		}
		else //for items without a submenu, add onMouseout effect
			menuitems[x].onmouseout=function(e){this.className=""; if (ddtabmenu.snap2original[0]==true) ddtabmenu.revert2default(this, tabid, e)}
		menuitems[x].onmouseover=function(){ddtabmenu.showsubmenu(tabid, this)}
		if (dselected=="auto" && typeof setalready=="undefined" && this.isSelected(menuitems[x].href)){
			ddtabmenu.showsubmenu(tabid, menuitems[x])
			this[tabid+"-dselected"]=menuitems[x]
			var setalready=true
		}
		else if (parseInt(dselected)==x){
			ddtabmenu.showsubmenu(tabid, menuitems[x])
			this[tabid+"-dselected"]=menuitems[x]
		}
	}
}
}

</script>

<script type="text/javascript">

ddtabmenu.definemenu("ddtabs5", 0) //initialize Tab Menu #5 with NO tabs selected 

</script>

<form name="navForm">
    <input type="hidden" ID="cu" Name="cu" value="kristi test" />
    <input type="hidden" ID="cuID" Name="cuID" value="kristi test ID" />

<div id="ddtabs5" class="chromemenu">
<ul>
<li>
<a onclick="javascript:this.className='current';document.getElementById('megaprocessSection').style.display='block';document.getElementById('doctypeSection').style.display='none';document.getElementById('reportsSection').style.display='none';"><span style="cursor:pointer">Mega Process</span></a>
</li>
<li>
<a onclick="javascript:this.className='current';document.getElementById('megaprocessSection').style.display='none';document.getElementById('doctypeSection').style.display='block';document.getElementById('reportsSection').style.display='none';"><span style="cursor:pointer">Document Type</span></a>
</li>
<li>
<a onclick="javascript:this.className='current';document.getElementById('megaprocessSection').style.display='none';document.getElementById('doctypeSection').style.display='none';document.getElementById('reportsSection').style.display='block';"><span style="cursor:pointer">Reports</span></a>
</li>
<li>
<a onclick="#"><span style="cursor:pointer">Help</span></a>
</li>
<li>
<a href="javascript:document.getElementById('cu').value=currentUser.userName;document.getElementById('cuID').value=currentUser.id;void(window.open('{ot:OTvar_livelink_cgiPath}/open/PDMSRequestForm_REQ','',''));"><span style="cursor:pointer">New Document</span></a>
</li>
</ul>
</div>
<br />
<div class="ddcolortabsline"></div>
<div class="tabcontainer">

<div id="megaprocessSection" style="display:block">
<table border="0" align="center" cellpadding="8" cellspacing="20">
  <tr>
    <td>
    <p style="text-align: center" align="center"><a href="#" onclick="FacetPanel.facetRun(1956049,'Customer Acquisition');return false" title="Apply filter of Mega Process: Customer Acquisition"><img height="85" border="0" src="/img/pdms_cv/images/customer_aquisition.png"></a><br />
      <br />
      Customer Acquisition</p>
    </td>
    <td>
    <p style="text-align: center" align="center"><a href="#" onclick="FacetPanel.facetRun(1956049,'Enabling Communications');return false" title="Apply filter of Mega Process: Enabling Communications"><img height="85" border="0" src="/img/pdms_cv/images/enabling_communications.png"></a><br />
      <br />
      Enabling Communications</p>
    </td>
    <td>
    <p style="text-align: center" align="center"><a href="#" onclick="FacetPanel.facetRun(1956049,'Enabling Enterprise Effectiveness');return false" title="Apply filter of Mega Process: Enabling Enterprise Effectiveness"><img height="85" border="0" src="/img/pdms_cv/images/enabling_ent_effectiveness.png"></a><br />
      <br />
      Enabling Enterprise Effectiveness</p>
    </td>
    <td>
    <p style="text-align: center" align="center"><a href="#" onclick="FacetPanel.facetRun(1956049,'Enabling Financial Accounting and Reporting');return false" title="Apply filter of Mega Process: Enabling Financial Accounting and Reporting"><img height="85" border="0" src="/img/pdms_cv/images/enabling_fin_acct_rept.png"></a><br />
      <br />
      Enabling Financial Accounting and Reporting</p>
    </td>
    <td>
    <p style="text-align: center" align="center"><a href="#" onclick="FacetPanel.facetRun(1956049,'Enabling IT Optimization');return false" title="Apply filter of Mega Process: Enabling IT Optimization"><img height="85" border="0" src="/img/pdms_cv/images/enabling_it_optimization.png"></a><br />
      <br />
      Enabling IT Optimization</p>
    </td>
  	<td>
    <p style="text-align: center" align="center"><a href="#" onclick="FacetPanel.facetRun(1956049,'Enabling Human Resource Management');return false" title="Apply filter of Mega Process: Enabling Human Resource Management"><img height="85" border="0" src="/img/pdms_cv/images/enabling_resource_mgmt.png"></a><br />
      <br />
      Enabling Human Resource Management</p>
    </td>
    <td>
    <p style="text-align: center" align="center"><a href="#" onclick="FacetPanel.facetRun(1956049,'Responsible Care and Sustainability');return false" title="Apply filter of Mega Process: Responsible Care and Sustainability"><img height="85" border="0" src="/img/pdms_cv/images/responsible_care_sust.png"></a><br />
      <br />
      Responsible Care and Sustainability</p>
    </td>
  </tr>
  </table>
  
  <table border="0" align="center" cellpadding="8" cellspacing="20">
  <tr align="center">
      <td>
    <p style="text-align: center" align="center"><a href="#" onclick="FacetPanel.facetRun(1956049,'Governing Ethics and Compliance');return false" title="Apply filter of Mega Process: Governing Ethics and Compliance"><img height="85" border="0" src="/img/pdms_cv/images/governing_ethics_compliance.png"></a><br />
      <br />
      Governing Ethics and Compliance</p>
    </td>
    <td>
    <p style="text-align: center" align="center"><a href="#" onclick="FacetPanel.facetRun(1956049,'New Solutions Development');return false" title="Apply filter of Mega Process: New Solutions Development"><img height="85" border="0" src="/img/pdms_cv/images/new_solutions_dev.png"></a><br />
      <br />
      New Solutions Development</p>
    </td>
    <td>
    <p style="text-align: center" align="center"><a href="#" onclick="FacetPanel.facetRun(1956049,'Supply Chain - Global Trade Management');return false" title="Apply filter of Mega Process: Supply Chain - Global Trade Management"><img height="85" border="0" src="/img/pdms_cv/images/supplychain_global_trade_mgmt.png"></a><br />
      <br />
      Supply Chain - Global Trade Management</p>
    </td>
    <td>
    <p style="text-align: center" align="center"><a href="#" onclick="FacetPanel.facetRun(1956049,'Supply Chain - Order to Cash');return false" title="Apply filter of Mega Process: Supply Chain - Order to Cash"><img height="85" border="0" src="/img/pdms_cv/images/supplychain_order_cash.png"></a><br />
      <br />
      Supply Chain - Order to Cash</p>
    </td>
    <td>
    <p style="text-align: center" align="center"><a href="#" onclick="FacetPanel.facetRun(1956049,'Supply Chain - Plan to Deliver');return false" title="Apply filter of Mega Process: Supply Chain - Plan to Deliver"><img height="85" border="0" src="/img/pdms_cv/images/supplychain_plan_deliver.png"></a><br />
      <br />
      Supply Chain - Plan to Deliver</p>
    </td>
  	<td>
    <p style="text-align: center" align="center"><a href="#" onclick="FacetPanel.facetRun(1956049,'Supply Chain - Source to Pay');return false" title="Apply filter of Mega Process: Supply Chain - Source to Pay"><img height="85" border="0" src="/img/pdms_cv/images/supplychain_source_pay.png"></a><br />
      <br />
      Supply Chain - Source to Pay</p>
    </td>
  </tr>
</table>
</div>

<div id="doctypeSection" style="display:none">
<table border="0" align="center" cellpadding="8" cellspacing="20">
  <tr>
    <td>
    <p style="text-align: center" align="center"><a href="{ot:OTvar_livelink_cgiPath}/open/Corporate_Policy"><img border="0" src="/img/pdms_cv/images/policy.png"  height="80px" alt=""></a><br />
      <br />
      Corporate Policy</p>
    </td>
    <td>
    <p style="text-align: center" align="center"><a href="{ot:OTvar_livelink_cgiPath}/open/Form"><img border="0" src="/img/pdms_cv/images/form.png"  height="80px" alt=""></a><br />
      <br />
      Form</p>
    </td>
    <td>
    <p style="text-align: center" align="center"><a href="{ot:OTvar_livelink_cgiPath}/open/Group_Policy"><img border="0" src="/img/pdms_cv/images/policy.png"  height="80px" alt=""></a><br />
      <br />
      Group Policy</p>
    </td>
    <td>
    <p style="text-align: center" align="center"><a href="{ot:OTvar_livelink_cgiPath}/open/Presentation"><img border="0" src="/img/pdms_cv/images/presentation.png"  height="80px" alt=""></a><br />
      <br />
      Presentation</p>
    </td>
    <td>
    <p style="text-align: center" align="center"><a href="{ot:OTvar_livelink_cgiPath}/open/Procedure"><img border="0" src="/img/pdms_cv/images/procedure.png"  height="80px" alt=""></a><br />
      <br />
      Procedure</p>
    </td>
  	<td>
    <p style="text-align: center" align="center"><a href="{ot:OTvar_livelink_cgiPath}/open/Program_Plan_Manual"><img border="0" src="/img/pdms_cv/images/program.png"  height="80px" alt=""></a><br />
      <br />
      Program/Plan/Manual</p>
    </td>
    <td>
    <p style="text-align: center" align="center"><a href="{ot:OTvar_livelink_cgiPath}/open/Reference"><img border="0" src="/img/pdms_cv/images/reference.png"  height="80px" alt=""></a><br />
      <br />
      Reference</p>
    </td>
    <td>
    <p style="text-align: center" align="center"><a href="{ot:OTvar_livelink_cgiPath}/open/Training"><img border="0" src="/img/pdms_cv/images/training.png"  height="80px" alt=""></a><br />
      <br />
      Training</p>
    </td>
    <td>
    <p style="text-align: center" align="center"><a href="{ot:OTvar_livelink_cgiPath}/open/Work_Instruction"><img border="0" src="/img/pdms_cv/images/work.png"  height="80px" alt=""></a><br />
      <br />
      Work Instruction</p>
    </td>
  </tr>
</table>
</div>


<div id="reportsSection" style="display:none">
<table border="0" align="center" cellpadding="8" cellspacing="20">
  <tr>
    <td>
    <p style="text-align: center" align="center"><a href="#"><img border="0" src="/img/pdms_cv/images/document_management.png"  height="80px" alt=""></a><br />
      <br />
      Placeholder</p>
    </td>
    <td>
    <p style="text-align: center" align="center"><a href="#"><img border="0" src="/img/pdms_cv/images/archiving.png"  height="80px" alt=""></a><br />
      <br />
      Placeholder</p>
    </td>
    <td>
    <p style="text-align: center" align="center"><a href="#"><img border="0" src="/img/pdms_cv/images/records_management.png"  height="80px" alt=""></a><br />
      <br />
      Placeholder</p>
    </td>
    <td>
    <p style="text-align: center" align="center"><a href="#"><img border="0" src="/img/pdms_cv/images/formsandworkflow.png"  height="80px" alt=""></a><br />
      <br />
      Placeholder</p>
    </td>
  </tr>
</table>
</div>

</div>
</form>

Open in new window

ASKER CERTIFIED SOLUTION
Michel Plungjan

Log in or sign up to see answer
Become an EE member today7-DAY FREE TRIAL
Members can start a 7-Day Free trial then enjoy unlimited access to the platform
Sign up - Free for 7 days
or
Learn why we charge membership fees
We get it - no one likes a content blocker. Take one extra minute and find out why we block content.
Not exactly the question you had in mind?
Sign up for an EE membership and get your own personalized solution. With an EE membership, you can ask unlimited troubleshooting, research, or opinion questions.
ask a question
Experts Exchange is like having an extremely knowledgeable team sitting and waiting for your call. Couldn't do my job half as well as I do without it!
James Murphy