Go Premium for a chance to win a PS4. Enter to Win

x
?
Solved

Compatibility issue with JAvascript menu and Ie9 10 11 and chrome

Posted on 2015-01-11
9
Medium Priority
?
248 Views
Last Modified: 2015-01-24
Hello,

I recently upgraded my asp.net web application from 1.1 to 3.5 but now my javascript menu always shows to the left of the screen and not under each menu item.

I have attached the javascript file for my menu

Then the code below calls the menu:
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>Untitled Page</title>
    <script language="JavaScript">
var temp=1;
            var project=<%=Session["project"]%>;
if(document.getElementById)
      document.write('<DIV class=popper id=topdeck></DIV>');
</script>
<SCRIPT language="JavaScript"  src="ejs_menu_dyn.js"></SCRIPT>
</head>
<body>
    <form id="form1" runat="server">
    <div>
    
    </div>
    </form>
</body>
</html>

Open in new window


Thanks
0
Comment
Question by:arnololo123
  • 4
  • 4
9 Comments
 
LVL 84

Expert Comment

by:Dave Baldwin
ID: 40543239
Please post a link to your page so we can check it.
0
 

Author Comment

by:arnololo123
ID: 40543259
Sorry I forget to attached the javascript file ejs_menu_dyn.js that I reference in my code.
I also attached a picture of what it does currently.

Unfortunately  at this time, I can't give access to the page because it is password protected and on client server.

Thanks
ejs-menu-dyn.js
WrongBehavior.png
0
 
LVL 84

Expert Comment

by:Dave Baldwin
ID: 40543272
That makes it nearly impossible to troubleshoot since we can't check the interactions in the code for the page.
0
VIDEO: THE CONCERTO CLOUD FOR HEALTHCARE

Modern healthcare requires a modern cloud. View this brief video to understand how the Concerto Cloud for Healthcare can help your organization.

 

Author Comment

by:arnololo123
ID: 40543306
By just using the code above and copying the js file, you should be able to reproduce the issue pretty easily.

Thanks
0
 
LVL 84

Expert Comment

by:Dave Baldwin
ID: 40543382
Ok, I tried to run you code.  It doesn't work, produces a blank screen because I don't have any of the files that are listed in 'ejs-menu-dyn.js'.  Even more importantly, 'document.write' has to be used in the body of the HTML document, not in the <head>, because it will 'write' to the document exactly where it is in the document.  As written, there is no way to guarantee that that will ever run properly.
0
 

Author Comment

by:arnololo123
ID: 40566492
I have attached a Visual Studio project to make it run.

All the sub menu are showing up on the left instead of showing under each  main menu.

Thanks
test.zip
WorkOK.png
0
 
LVL 84

Expert Comment

by:Dave Baldwin
ID: 40567207
You need to click "Request Attention" above and get some others to help you.  I do not have a copy of visual Studio to run your code.
0
 
LVL 83

Accepted Solution

by:
leakim971 earned 2000 total points
ID: 40568276
replace :
skn.top = posYmenu+24;
by :
skn.top = posYmenu+24 + "px";
and replace :
skn.left = posXmenu+pos;
by :
skn.left = posXmenu+pos+"px";

or just replace your current ejs-menu-dyn.js with this one  :
var Timer;  
var racine = "../../LPCv2";
var len=temp;
var proj=project;
posYmenu = 91;
bgcolor='#920C0C';
bgcolor2='#6699CC';
needcenter =false;
taille=600;
//len=4;
if(!needcenter)
	posXmenu = 0;
else
	{	if (document.all)
		posXmenu = (document.body.clientWidth/2)-(400/2);
	else
		posXmenu = (window.innerWidth/2)-(400/2); 
	}
document.write('<style type="text/css">');
document.write('.popper { POSITION: absolute; VISIBILITY: hidden; z-index:11; }')
document.write('#topgauche { position:absolute; top:'+posYmenu+'px; left:'+posXmenu+'px; z-index:10; }')
document.write('A:hover.ejsmenu {color:#FFFFFF; text-decoration:underline;}')
document.write('A.ejsmenu {color:#FFFFFF; text-decoration:none;}')
document.write('</style>')

document.write('<DIV class=popper id=topdeck ></DIV>');




/*

*/
zlien = new Array;
zlien[0] = new Array;
zlien[1] = new Array;
//zlien[2] = new Array;
//zlien[3] = new Array;
zlien[4] = new Array;
zlien[5] = new Array;
zlien[6] = new Array;


zlien[1][3] = 'onClick=Javascript:document.location.href=\"' + racine + '/visualinstruct.aspx\"; >&nbsp;&nbsp;4. Visual Instructions';
zlien[1][4] = 'onClick=Javascript:document.location.href=\"' + racine + '/openissue/openissue.aspx\"; >&nbsp;&nbsp;5. Open Issues';
zlien[1][0] = 'onClick=Javascript:document.location.href=\"' + racine + '/echart/index.aspx\"; >&nbsp;&nbsp;1. I-Chart';
zlien[1][1] = 'onClick=Javascript:document.location.href=\"' + racine + '/echart/qc.aspx\"; >&nbsp;&nbsp;2. Defect Log Analysis';
zlien[1][2] = 'onClick=Javascript:document.location.href=\"' + racine + '/echart/partdata.aspx\"; >&nbsp;&nbsp;3. PART  Analysis&nbsp;&nbsp;&nbsp;&nbsp;<I>New</I>';
zlien[1][5] = 'onClick=Javascript:document.location.href=\"' + racine + '/dailyreport/dailyreport.aspx\"; >&nbsp;&nbsp;6. Daily Report';


if(len<=3)
{
	switch(len){
	case 3:
		taille=700
		zlien[2] = new Array;
		zlien[2][0] = 'onClick=Javascript:document.location.href=\"' + racine + '/admin/projectmgmt.aspx\";>&nbsp;&nbsp;1. Manage Projects';
		break;
	case 2:
		taille=700
		zlien[2] = new Array;
		zlien[2][0] = 'onClick=Javascript:document.location.href=\"' + racine + '/admin/projectmgmt.aspx\";>&nbsp;&nbsp;1. Manage Projects';
		zlien[2][1] = 'onClick=Javascript:document.location.href=\"' + racine + '/admin/addproject.aspx\";>&nbsp;&nbsp;2. Create Project';
		break;
	default: 
		taille=700
		zlien[2] = new Array;
		zlien[2][0] = 'onClick=Javascript:document.location.href=\"' + racine + '/stats.aspx\";>&nbsp;&nbsp;1. Statistics';
		zlien[2][1] = 'onClick=Javascript:document.location.href=\"' + racine + '/admin/projectmgmt.aspx\";>&nbsp;&nbsp;2. Manage Projects';
		zlien[2][2] = 'onClick=Javascript:document.location.href=\"' + racine + '/admin/addproject.aspx\";>&nbsp;&nbsp;3. Create Project';
		if(len<2)
		{
		zlien[2][3] = 'onClick=Javascript:document.location.href=\"' + racine + '/finance/emplist.aspx\";>&nbsp;4.User List';
		zlien[2][4] = 'onClick=Javascript:document.location.href=\"' + racine + '/finance/newuser.aspx\";>&nbsp;5.New User';
		}		
		break;
	} 
}


zlien[6][0] = 'onClick=Javascript:document.location.href=\"' + racine + '/qualityalert/openissue.aspx\";>&nbsp;&nbsp;1. Open Issue';
zlien[6][1] = 'onClick=Javascript:document.location.href=\"' + racine + '/qualityalert/addqualityalert.aspx\";>&nbsp;&nbsp;2. Add Quality Alert';


zlien[4][0] = 'onClick=Javascript:document.location.href=\"' + racine + '/shopfloor/shopflooraudit.aspx\";>&nbsp;&nbsp;1. CheckList';
zlien[4][1] = 'onClick=Javascript:document.location.href=\"' + racine + '/shopfloor/summary.aspx\";>&nbsp;&nbsp;2. Summary';
zlien[4][2] = 'onClick=Javascript:document.location.href=\"' + racine + '/shopfloor/actionform.aspx\";>&nbsp;&nbsp;3. Action Form';

if(len<4){//lynn does not want customer to see timesheet
zlien[5][0] = 'onClick=Javascript:document.location.href=\"' + racine + '/finance/sumfin.aspx\";>&nbsp;1.TimeSheets';
zlien[5][1] = 'onClick=Javascript:document.location.href=\"' + racine + '/finance/hereport.aspx\";>&nbsp;2.TimeSheet-Hours/Expenses';
}

if(len<2)
{
zlien[5][2] = 'onClick=Javascript:document.location.href=\"' + racine + '/finance/totfin.aspx\";>&nbsp;3.General Finance';
zlien[5][3] = 'onClick=Javascript:document.location.href=\"' + racine + '/finance/emplist.aspx\";>&nbsp;4.User List';
}

var bit=0;
var nava = (document.layers);
var dom = (document.getElementById);
var iex = (document.all);
if (nava) { skn = document.topdeck }
else if (dom) { skn = document.getElementById("topdeck").style }
else if (iex) { skn = topdeck.style }
skn.top = posYmenu+24 + "px";


function pop(msg,pos)
{
bit=1;
skn.visibility = "hidden";
a=true
skn.left = posXmenu+pos+"px";
var content ="<TABLE BORDER=0 CELLPADDING=0 BGCOLOR=#000000 CELLSPACING=0  WIDTH=160><TR><TD><TABLE WIDTH=100%  BORDER=0 onmouseout='adieu(this);'  CELLPADDING=0 CELLSPACING=1>";
pass = 0
while (pass < msg.length)
	{
	content += "<TR><TD style=\"CURSOR: hand;font-family:Verdana;  font-size:11px; color:white\"  BGCOLOR="+bgcolor+"  onMouseOver=\"this.style.background='"+bgcolor2+"'\" onMouseOut=\"this.style.background='"+bgcolor+"'\" HEIGHT=18  "+msg[pass]+"</TD></TR>";
	pass++;
	}
	content += "</TABLE></TD></TR></TABLE>";
if (nava)
  {
    skn.document.write(content);
	  skn.document.close();
	  skn.visibility = "visible";
	  
  }
    else if (dom)
  {
	  document.getElementById("topdeck").innerHTML = content;
	  skn.visibility = "visible";
	 
  }
    else if (iex)
  {
	  document.all("topdeck").innerHTML = content;
	  skn.visibility = "visible";
	 
  }
  
}

function kill()
{

	skn.visibility = "hidden";
}
 

function adieu(objTable)
{ 
if(!objTable.contains(event.toElement)){ 
bit=0;
Timer = setTimeout('TimerHideMenu()',1000);
}

}

function TimerHideMenu(){ 
		
          HideMenu(); 
          clearTimeout(Timer); 
    
} 
function HideMenu(){ 
	if(bit==0)
     {skn.visibility = "hidden";}
     
}  


document.onclick = kill;

	document.write('<DIV ID=topgauche><TABLE BORDER=0 CELLPADDING=0 CELLSPACING=0 BGCOLOR=#000000 WIDTH="100%"><TR><TD><TABLE CELLPADING=0 CELLSPACING=1 BORDER=0 WIDTH='+taille+' HEIGHT=20><TR>')
	if (proj>0)
{document.write('<TD WIDTH="80" ALIGN=center BGCOLOR='+bgcolor+' onMouseOver="this.style.background=\''+bgcolor2+'\'" onMouseOut="this.style.background=\''+bgcolor+'\'"><A href="/default.aspx" CLASS=ejsmenu><FONT SIZE=1 FACE="Verdana"><B>Home Page</B></FONT></a></TD>')
	document.write('<TD WIDTH="120" ALIGN=center BGCOLOR='+bgcolor+' onMouseOver="this.style.background=\''+bgcolor2+'\';pop(zlien[1],80)" onMouseOut="this.style.background=\''+bgcolor+'\'"><A  onMouseOver="pop(zlien[1],90)" href="../summary.aspx" CLASS=ejsmenu><FONT SIZE=1 color=white FACE="Verdana"><B>PROJECT CENTER</B></FONT></a></TD>')
	document.write('<TD WIDTH="120" ALIGN=center BGCOLOR='+bgcolor+' onMouseOver="this.style.background=\''+bgcolor2+'\';pop(zlien[6],180)" onMouseOut="this.style.background=\''+bgcolor+'\'"><A  onMouseOver="pop(zlien[6],60)" href="../summary.aspx" CLASS=ejsmenu><FONT SIZE=1 color=white FACE="Verdana"><B>Quality Alert</B></FONT></a></TD>')
	document.write('<TD WIDTH="110" ALIGN=center BGCOLOR='+bgcolor+' onMouseOver="this.style.background=\''+bgcolor2+'\';pop(zlien[4],290)" onMouseOut="this.style.background=\''+bgcolor+'\'"><A onClick="return(false)" onMouseOver="pop(zlien[4],258)" href=# CLASS=ejsmenu><FONT SIZE=1 color=white FACE="Verdana"><B>Floor audit</B></FONT></a></TD>')
	document.write('<TD WIDTH="110" ALIGN=center BGCOLOR='+bgcolor+' onMouseOver="this.style.background=\''+bgcolor2+'\';pop(zlien[5],410)" onMouseOut="this.style.background=\''+bgcolor+'\'"><A onClick="return(false)" onMouseOver="pop(zlien[5],320)" href=# CLASS=ejsmenu><FONT SIZE=1 color=white FACE="Verdana"><B>Finances</B></FONT></a></TD>')

}
else {document.write('<TD WIDTH="65%" ALIGN=center BGCOLOR='+bgcolor+'  CLASS=ejsmenu></a></TD>')}

//lynn does not want customer to see timesheet
if(len<=3)	{document.write('<TD WIDTH="110" ALIGN=center BGCOLOR='+bgcolor+' onMouseOver="this.style.background=\''+bgcolor2+'\';pop(zlien[2],500)" onMouseOut="this.style.background=\''+bgcolor+'\'"><A onClick="return(false)" onMouseOver="pop(zlien[2],390)" href=# CLASS=ejsmenu><FONT SIZE=1 color=white FACE="Verdana"><B>Administration</B></FONT></a></TD>')}
	
document.write('<TD ALIGN=center width="60px" BGCOLOR='+bgcolor+' onMouseOver="this.style.background=\''+bgcolor2+'\'" onMouseOut="this.style.background=\''+ bgcolor +'\'"><A HREF="/signout.aspx"  href=# CLASS=ejsmenu><FONT SIZE=1 FACE="Verdana" color=WHITE><B>Log Out</B></FONT></a></TD>')
document.write('</TR></TABLE></TD><TD width="50%" bgcolor=' + bgcolor + '></TD></TR></TABLE></DIV>')

Open in new window


test page : http://jsfiddle.net/xLbdxx0n/
0
 

Author Closing Comment

by:arnololo123
ID: 40568349
Awesome, Thank you. You also put an example, that is great.
0

Featured Post

Free Tool: ZipGrep

ZipGrep is a utility that can list and search zip (.war, .ear, .jar, etc) archives for text patterns, without the need to extract the archive's contents.

One of a set of tools we're offering as a way to say thank you for being a part of the community.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Performance in games development is paramount: every microsecond counts to be able to do everything in less than 33ms (aiming at 16ms). C# foreach statement is one of the worst performance killers, and here I explain why.
Originally, this post was published on Monitis Blog, you can check it here . In business circles, we sometimes hear that today is the “age of the customer.” And so it is. Thanks to the enormous advances over the past few years in consumer techno…
The viewer will learn how to count occurrences of each item in an array.
This tutorial will teach you the core code needed to finalize the addition of a watermark to your image. The viewer will use a small PHP class to learn and create a watermark.

885 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question