473,395 Members | 1,996 Online
Bytes | Software Development & Data Engineering Community
Post Job

Home Posts Topics Members FAQ

Join Bytes to post your question to a community of 473,395 software developers and data experts.

Javascript Menu not loading images

Hi Everyone,

I have created a Javascript menu for my site which uses frames. The first
stage loads fine but I want two drill down menus ("About Me Menu" and
"Projects Menu"). The pages load fine, but the images aren't displayed,
instead the alt text is shown. The images come up after you "Mouse Over"
them but not before......can anybody spot any errors in my code which could
be doing this please. For info, I have 4 images for each button, to take
into acount whether the button had been used and to give a mouse-over image
for each state. I have also deleted the code for items 3-5 as they are
commercially sensitive.

Thanks in Advance,

John

Code Follows:
-----------------

<html>

<head>
<title>Welcome to John's Homepage</title>
<html>

<head>
<meta http-equiv="content-type" content="text/html;charset=iso-8859-1">
<title>Welcome to John's Internet Site</title>

<SCRIPT language=javascript type=text/javascript>
<!-- Hide Me

if (top.location != self.location) {top.location = self.location}

if (document.images)

{

up = new Array("Up.gif","UpF.gif","UpP.gif","UpFP.gif");
aboutMe = new Array("About Me.gif","About MeF.gif","About MeP.gif","About
MeFP.gif");
myCv = new Array("My CV.gif","My CVF.gif","My CVP.gif","My CVFP.gif");
javaScript = new
Array("Javascript.gif","JavascriptF.gif","Javascri ptP.gif","JavascriptFP.gif
");
photos = new
Array("Photos.gif","PhotosF.gif","PhotosP.gif","UP hotosFP.gif");
projects = new
Array("Projects.gif","ProjectsF.gif","ProjectsP.gi f","ProjectsFP.gif");
wallPapers = new
Array("Wallpaper.gif","WallpaperF.gif","WallpaperP .gif","WallpaperFP.gif");

var up_1=0
var up_2=0
var about_me=0
var my_cv=0
var java_script=0
var photos_1=0
var projects_1=0
var wall_papers=0

}

else

{

up = "";
document.up = "";
aboutMe = "";
document.aboutme = "";
myCV = "";
document.myCV = "";
javaScript= "";
document.javaScript = "";
photos = "";
document.photos = "";
projects = "";
document.projects = "";
wallPapers = "";
document.wallPapers = "";

}
function evalRollon(item)

{
if (item==98)

if (up_1==0)

{ Left.up.src=up[1] }
else
{ Left.up.src=up[3] }
}

if (item==99)

if (up_2==0)

{ Left.up.src=up[1] }
else
{ Left.up.src=up[3] }
}
if (item==1)

{
if (about_me==0)

{ Left.about.src=aboutMe[1] }
else
{ Left.about.src=aboutMe[3] }
}

if (item==2)

if (my_cv==0)

{ Left.cv.src=myCv[1] }
else
{ Left.cv.src=myCv[3] }
}

if (item==6)

if (java_script==0)

{ Left.java.src=javaScript[1] }
else
{ Left.java.src=javaScript[3] }
}

if (item==7)

if (photos_1==0)

{ Left.photos.src=photos[1] }
else
{ Left.photos.src=photos[3] }
}

if (item==8)

if (projects_1==0)

{ Left.projects.src=projects[1] }
else
{ Left.projects.src=projects[3] }
}

if (item==9)

if (wall_papers==0)

{ Left.wallpapers.src=wallPapers[1] }
else
{ Left.wallpapers.src=wallPapers[3] }
}
}
function evalImage(item)

{
if (item==98)

if (up_1==0)

{ Left.up.src=up[0] }
else
{ Left.up.src=up[2] }
}

if (item==99)

if (up_2==0)

{ Left.up.src=up[0] }
else
{ Left.up.src=up[2] }
}
if (item==1)

{
if (about_me==0)

{ Left.about.src=aboutMe[0] }
else
{ Left.about.src=aboutMe[2] }
}

if (item==2)

if (my_cv==0)

{ Left.cv.src=myCv[0] }
else
{ Left.cv.src=myCv[2] }
}
if (item==6)

if (java_script==0)

{ Left.java.src=javaScript[0] }
else
{ Left.java.src=javaScript[2] }
}

if (item==7)

if (photos_1==0)

{ Left.photos.src=photos[0] }
else
{ Left.photos.src=photos[2] }
}

if (item==8)

if (projects_1==0)

{ Left.projects.src=projects[0] }
else
{ Left.projects.src=projects[2] }
}

if (item==9)

if (wall_papers==0)

{ Left.wallpapers.src=wallPapers[0] }
else
{ Left.wallpapers.src=wallPapers[2] }
}
}

function uponecount()
{++up_1}

function uptwocount()
{++up_2}

function amcount()
{++about_me}

function cvcount()
{++my_cv}

function javacount()
{++java_script}

function photocount()
{++photos_1}

function projectcount()
{++projects_1}

function wallcount()
{++wall_paper}

function mainMenu()


{
parent.Left.document.close()
parent.Left.document.open()
parent.Left.document.writeln('<html><head
onLoad="top.evalImage(1)","top.evalImage(8)">')
parent.Left.document.writeln("<TITLE>Welcome to Johns Internet Page -
Contents Menu</TITLE>")
parent.Left.document.writeln('</head><body bgcolour="white">')
parent.Left.document.writeln('<P><A target=Left')
parent.Left.document.writeln('onclick="top.aboutme menu();top.amcount()"')
parent.Left.document.writeln('onmouseout="top.eval Image(1)"')
parent.Left.document.writeln('onmouseover="top.eva lRollon(1)">')
parent.Left.document.writeln('<img src="About Me.gif" alt="About Me"
width=250 height=50 border=0 name="about"></A>')
parent.Left.document.writeln('</P><P><A href="top.projects()"
target=Left')

parent.Left.document.writeln('onclick="top.project smenu();top.projectcount()
"')
parent.Left.document.writeln('onmouseout="top.eval Image(8)"')
parent.Left.document.writeln('onmouseover="top.eva lRollon(8)">')
parent.Left.document.writeln('<img src="Projects.gif" alt="Projects"
width=250 height=50 border=0 name="projects"></A>')
parent.Left.document.writeln('</P>')
parent.Left.document.writeln("</body></html>")
}

function aboutmemenu()

{
parent.Left.document.close()
parent.Left.document.open()
parent.Left.document.writeln('<html><head
onLoad="top.evalImage(98)","top.evalImage(2)","top .evalImage(4)">')
parent.Left.document.writeln("<TITLE>Welcome to Johns Internet Page - About
Me Menu</TITLE>")
parent.Left.document.writeln('</head><body bgcolour="white">')
parent.Left.document.writeln('<P><A target=Left')
parent.Left.document.writeln('onclick="top.mainMen u();top.uponecount()"')
parent.Left.document.writeln('onmouseout="top.eval Image(98)"')
parent.Left.document.writeln('onmouseover="top.eva lRollon(98)"')
parent.Left.document.writeln('onLoad="top.evalImag e(98)" return="false">')
parent.Left.document.writeln('<img src=top.evalImage(98) alt="Up" width=250
height=50 border=0 name="up"></A>')
parent.Left.document.writeln('</P><P><A href="mycv.html" target=Right')
parent.Left.document.writeln('onclick="top.cvcount ()"')
parent.Left.document.writeln('onmouseout="top.eval Image(2)"')
parent.Left.document.writeln('onmouseover="top.eva lRollon(2)"')
parent.Left.document.writeln('onLoad=top.evalImage (2) return="false">')
parent.Left.document.writeln('<img src="top.evalImage(2)" alt="My CV"
width=250 height=50 border=0 name="cv"></A>')

parent.Left.document.writeln('</P>')
parent.Left.document.writeln("</body></html>")
}
up = new Array("Up.gif","UpF.gif","UpP.gif","UpFP.gif");
aboutMe = new Array("About Me.gif","About MeF.gif","About MeP.gif","About
MeFP.gif");
myCv = new Array("My CV.gif","My CVF.gif","My CVP.gif","My CVFP.gif");
javaScript = new
Array("Javascript.gif","JavascriptF.gif","Javascri ptP.gif","JavascriptFP.gif
");
photos = new
Array("Photos.gif","PhotosF.gif","PhotosP.gif","UP hotosFP.gif");
projects = new
Array("Projects.gif","ProjectsF.gif","ProjectsP.gi f","ProjectsFP.gif");
wallPapers = new
Array("Wallpaper.gif","WallpaperF.gif","WallpaperP .gif","WallpaperFP.gif");
function projectsmenu()

{
parent.Left.document.close()
parent.Left.document.open()
parent.Left.document.writeln("<html><head>")
parent.Left.document.writeln("<TITLE>Welcome to Johns Internet Page - About
Me Menu</TITLE>")
parent.Left.document.writeln('</head><body bgcolour="white">')
parent.Left.document.writeln('<P><A target=Left')
parent.Left.document.writeln('onclick="top.mainMen u();top.uptwocount()"')
parent.Left.document.writeln('onmouseout="top.eval Image(99)"')
parent.Left.document.writeln('onmouseover="top.eva lRollon(99)"')
parent.Left.document.writeln('onLoad="top.evalImag e(99)" return="false">')
parent.Left.document.writeln('<img src="top.evalImage(99)" alt="Up"
width=250 height=50 border=0 name="up"></A>')
parent.Left.document.writeln('</P><P><A href="javascript.html"
target=Right')
parent.Left.document.writeln('onclick="top.javacou nt()"')
parent.Left.document.writeln('onmouseout="top.eval Image(6)"')
parent.Left.document.writeln('onmouseover="top.eva lRollon(6)"')
parent.Left.document.writeln('onLoad="top.evalImag e(6)" return="false">')
parent.Left.document.writeln('<img src="top.evalImage(6)" alt="Java"
width=250 height=50 border=0 name="java"></A>')
parent.Left.document.writeln('</P><P><A href="Photos.html" target=Right')
parent.Left.document.writeln('onclick="top.photoco unt()"')
parent.Left.document.writeln('onmouseout="top.eval Image(7)"')
parent.Left.document.writeln('onmouseover="top.eva lRollon(7)"')
parent.Left.document.writeln('onLoad="top.evalImag e(7)" return="false">')
parent.Left.document.writeln('<img src="top.evalImage(7)" alt="Java"
width=250 height=50 border=0 name="photos"></A>')
parent.Left.document.writeln('</P><P><A href="wallpapers.html"
target=Right')
parent.Left.document.writeln('onclick="top.wallcou nt()"')
parent.Left.document.writeln('onmouseout="top.eval Image(9)"')
parent.Left.document.writeln('onmouseover="top.eva lRollon(9)"')
parent.Left.document.writeln('onLoad="top.evalImag e(9)" return="false">')
parent.Left.document.writeln('<img src="top.evalImage(9)" alt="Wallpapers"
width=250 height=50 border=0 name="wallpapers"></A>')
parent.Left.document.writeln('</P>')
parent.Left.document.writeln("</body></html>")
}

// Stop Hiding Me. -->
</SCRIPT>

</head>

<frameset rows="80,*" framespacing="0" border="0" frameborder="NO">
<frame src="Top.html" name="Top" noresize>
<frameset cols="250,*" framespacing="0" border="0" frameborder="NO"
onload="mainMenu()">
<frame name="Left" noresize>
<frame src="Right.html" name="Right" noresize>
</frameset>
</frameset>

<noframes>

<body>

</body>

</noframes>
</html>

Jul 23 '05 #1
10 1998
Ok, I've looked at what's happening and I think I have narrowed down the
problem. The main "frames.html" creates the left-hand frame with the menu
on it. The first menu loads correctly because the page is being loades from
scratch, but the second page doesn't. I can't spot a difference in the page
code (copied below for info) so I can only assume some sort of refresh is
needed.

If anybody could tell me if I'm on the right lines I'd really appreciate it,

Thanks,

John

Html Follows:
----------------

The following code works:

<html><head onLoad="top.evalImage(1)","top.evalImage(8)">
<TITLE>Welcome to John Ortts Internet Page - Contents Menu</TITLE>
</head><body bgcolour="white">
<P><A target=Left
onclick="top.aboutmemenu();top.amcount()"
onmouseout="top.evalImage(1)"
onmouseover="top.evalRollon(1)">
<img src="About Me.gif" alt="About Me" width=250 height=50 border=0
name="about"></A>
</P><P><A href="top.projects()" target=Left
onclick="top.projectsmenu();top.projectcount()"
onmouseout="top.evalImage(8)"
onmouseover="top.evalRollon(8)">
<img src="Projects.gif" alt="Projects" width=250 height=50 border=0
name="projects"></A>
</P>
</body></html>
This code doesn't buit is essentially the same:

<html><head
onLoad="top.evalImage(98)","top.evalImage(2)","top .evalImage(4)">
<TITLE>Welcome to John Ortts Internet Page - About Me Menu</TITLE>
</head><body bgcolour="white">
<P><A target=Left
onclick="top.mainMenu();top.uponecount()"
onmouseout="top.evalImage(98)"
onmouseover="top.evalRollon(98)"
onLoad="top.evalImage(98)" return="false">
<img src=top.evalImage(98) alt="Up" width=250 height=50 border=0
name="up"></A>
</P><P><A href="mycv.html" target=Right
onclick="top.cvcount()"
onmouseout="top.evalImage(2)"
onmouseover="top.evalRollon(2)"
onLoad=top.evalImage(2) return="false">
<img src="top.evalImage(2)" alt="My CV" width=250 height=50 border=0
name="cv"></A>
</P>
</body></html>


Jul 23 '05 #2
On Fri, 16 Jul 2004 10:35:56 +0100, John Ortt wrote:
Code Follows:


You do realize that a single URL would have
been more effective and over 400 lines
shorter than the post you made?

--
Andrew Thompson
http://www.PhySci.org/ Open-source software suite
http://www.PhySci.org/codes/ Web & IT Help
http://www.1point1C.org/ Science & Technology
Jul 23 '05 #3
Not when that url is on an Intranet,

(and I don't have webspace outside the company).

"Andrew Thompson" <Se********@www.invalid> wrote in message
news:32****************************@40tude.net...
On Fri, 16 Jul 2004 10:35:56 +0100, John Ortt wrote:
Code Follows:


You do realize that a single URL would have
been more effective and over 400 lines
shorter than the post you made?

--
Andrew Thompson
http://www.PhySci.org/ Open-source software suite
http://www.PhySci.org/codes/ Web & IT Help
http://www.1point1C.org/ Science & Technology

Jul 23 '05 #4
On Fri, 16 Jul 2004 16:36:30 +0100, John Ortt wrote:
(and I don't have webspace outside the company).


GeoCities.. (It's a big internet)

Alternatively, if 'the company' is serious about
solving the problem, why are they not prepared to
throw a couple of bucks out for getting a short
term 'testing' site?

[ And if the company is *not* serious about
solving the problem, it begs the question of
why you expect random strangers to care. ]

--
Andrew Thompson
http://www.PhySci.org/ Open-source software suite
http://www.PhySci.org/codes/ Web & IT Help
http://www.1point1C.org/ Science & Technology
Jul 23 '05 #5
Lee
John Ortt said:
This code doesn't buit is essentially the same:
Since the difference is that the images don't load,
the obvious place to focus is the "src" attributes
of the <img> tags.

In the following (non-working) code, you're trying
to assign Javascript variables as src attributes.
You can't mix Javascript and HTML like that:

<html><head
onLoad="top.evalImage(98)","top.evalImage(2)","to p.evalImage(4)">
<TITLE>Welcome to John Ortts Internet Page - About Me Menu</TITLE>
</head><body bgcolour="white">
<P><A target=Left
onclick="top.mainMenu();top.uponecount()"
onmouseout="top.evalImage(98)"
onmouseover="top.evalRollon(98)"
onLoad="top.evalImage(98)" return="false">
<img src=top.evalImage(98) alt="Up" width=250 height=50 border=0
name="up"></A>
</P><P><A href="mycv.html" target=Right
onclick="top.cvcount()"
onmouseout="top.evalImage(2)"
onmouseover="top.evalRollon(2)"
onLoad=top.evalImage(2) return="false">
<img src="top.evalImage(2)" alt="My CV" width=250 height=50 border=0
name="cv"></A>
</P>
</body></html>


Jul 23 '05 #6
In article <40**********@baen1673807.greenlnk.net>,
Jo******@Idontwantspamsonoreturnaddress.com enlightened us with...
Not when that url is on an Intranet,

(and I don't have webspace outside the company).


Geocities (yahoo) offers free webspace that is mostly useless but works
great for this sort of thing.

--
--
~kaeli~
Acupuncture is a jab well done.
http://www.ipwebdesign.net/wildAtHeart
http://www.ipwebdesign.net/kaelisSpace

Jul 23 '05 #7
Lee
John Ortt said:
I have created a Javascript menu for my site which uses frames.


You could cut your code about in half by using "switch"
statements in place of the "if"s. There are even better
ways to do this, that don't involve passing numeric codes.

Please get rid of the series of functions that each increment
a single global variable.

Your call to the function:
function uponecount()
{++up_1}

can be replaced by:
top.up_1++

Jul 23 '05 #8
Thanks for the info Andrew.

I didn't know there were places offering free webspace. I will try to put
it on the GeoCities website later on in the week and repost.

I will also try to include some of the tips Lee gave me to shorten the code.

The site is essentially a personnal homepage for me on the company intranet
(They have an area set aside for the employees).

It is intended to tell people what I do and how I do it and gives links to
the department.

For this reason it isn't business critical and there is no way the company
are going to release funding for me to develop it :(

But I would like to get it working if possible just to improve my knowledge
of the subject.

Thanks again,

John
"Andrew Thompson" <Se********@www.invalid> wrote in message
news:f1*****************************@40tude.net...
On Fri, 16 Jul 2004 16:36:30 +0100, John Ortt wrote:
(and I don't have webspace outside the company).


GeoCities.. (It's a big internet)

Alternatively, if 'the company' is serious about
solving the problem, why are they not prepared to
throw a couple of bucks out for getting a short
term 'testing' site?

[ And if the company is *not* serious about
solving the problem, it begs the question of
why you expect random strangers to care. ]

--
Andrew Thompson
http://www.PhySci.org/ Open-source software suite
http://www.PhySci.org/codes/ Web & IT Help
http://www.1point1C.org/ Science & Technology

Jul 23 '05 #9
On Mon, 19 Jul 2004 11:15:09 +0100, John Ortt wrote:
I didn't know there were places offering free webspace. I will try to put
it on the GeoCities website later on in the week and repost.

I will also try to include some of the tips Lee gave me to shorten the code.
That is a good idea. I wrote a page on just how
much it can help to shorten and simplify code.

The article is more focused on Java (a different
language to JS) but I feel you might find some
valuable tips in it in any case..
<http://www.physci.org/codes/sscce.jsp>
But I would like to get it working if possible
just to improve my knowledge of the subject.


People who are trying to improve their knowledge
are very welcome on this group, especially if
they have displayed that they can benefit from
the advice they receive.

Continue reading the froup and you may spot the
answer to your problem, but if you simplify your
code and still do not get the problem sorted, post
it to GeoCities and make a new post on this thread
with the URL.

I am confident someone will be able to spot the error.

--
Andrew Thompson
http://www.PhySci.org/ Open-source software suite
http://www.PhySci.org/codes/ Web & IT Help
http://www.1point1C.org/ Science & Technology
Jul 23 '05 #10
Thanks Andrew,

I haven't looked at the page you linked yet but I will do so tonight.

Also, I didn't fully understand Lee's post on getting rid of the "If"
statements so until I do, I have just used a tidier "if" format which I
found on "Webmonkey".

I have reposted the tidier code allong with a geocities site in the
newsgroup.

Thanks for your time once again,

John Ortt


"Andrew Thompson" <Se********@www.invalid> wrote in message
news:vp******************************@40tude.net.. .
On Mon, 19 Jul 2004 11:15:09 +0100, John Ortt wrote:
I didn't know there were places offering free webspace. I will try to put it on the GeoCities website later on in the week and repost.

I will also try to include some of the tips Lee gave me to shorten the
code.
That is a good idea. I wrote a page on just how
much it can help to shorten and simplify code.

The article is more focused on Java (a different
language to JS) but I feel you might find some
valuable tips in it in any case..
<http://www.physci.org/codes/sscce.jsp>
But I would like to get it working if possible
just to improve my knowledge of the subject.


People who are trying to improve their knowledge
are very welcome on this group, especially if
they have displayed that they can benefit from
the advice they receive.

Continue reading the froup and you may spot the
answer to your problem, but if you simplify your
code and still do not get the problem sorted, post
it to GeoCities and make a new post on this thread
with the URL.

I am confident someone will be able to spot the error.

--
Andrew Thompson
http://www.PhySci.org/ Open-source software suite
http://www.PhySci.org/codes/ Web & IT Help
http://www.1point1C.org/ Science & Technology

Jul 23 '05 #11

This thread has been closed and replies have been disabled. Please start a new discussion.

Similar topics

4
by: JesusFreak | last post by:
From: us_traveller@yahoo.com (JesusFreak) Newsgroups: microsoft.public.scripting.jscript Subject: toolbar script problem NNTP-Posting-Host: 192.92.126.136 Recently, I downloaded the following...
3
by: John Ortt | last post by:
Hi everyone, I posted with the title "Javascript Menu Not Loading Images" last week but I only posted the code as the site was on a corporate Intranet. Thanks to advice on the thread I have...
3
by: John Ortt | last post by:
I appologise for reposting this but I have been trying to find a solution all week with no avail and I was hoping a repost might help somebody more knowledgable than myself to spot the message... ...
3
by: jimmygoogle | last post by:
I posted earlier with a scope problem. I think I resolved it in IE but in Firefox it still exists. Anyone have any ideas/experience with this? I attached my code sorry it is so long. You can...
12
by: tim | last post by:
I am using foldoutmenu 3 and am having problems with viewing my menus in firefox. On my sub3 menus i have more than one line of text in some places. firefox does not recognise that there is more...
5
by: sindhu | last post by:
Hello, I want to use Images as menu and menu items using javascript.The aim is that i have images with the menu items. when i click the image on that perticular mmenu item i want an image to be...
1
by: CKich30 | last post by:
When viewing my page (siuehockey.net) in Firefox, it's setup how I want it to look. When i viewed it using IE, the menu at the top runs into the "Cougar Hockey/cougarhockey.net" at the top left....
0
by: Charles Arthur | last post by:
How do i turn on java script on a villaon, callus and itel keypad mobile phone
0
by: ryjfgjl | last post by:
In our work, we often receive Excel tables with data in the same format. If we want to analyze these data, it can be difficult to analyze them because the data is spread across multiple Excel files...
0
BarryA
by: BarryA | last post by:
What are the essential steps and strategies outlined in the Data Structures and Algorithms (DSA) roadmap for aspiring data scientists? How can individuals effectively utilize this roadmap to progress...
1
by: nemocccc | last post by:
hello, everyone, I want to develop a software for my android phone for daily needs, any suggestions?
0
by: Hystou | last post by:
There are some requirements for setting up RAID: 1. The motherboard and BIOS support RAID configuration. 2. The motherboard has 2 or more available SATA protocol SSD/HDD slots (including MSATA, M.2...
0
marktang
by: marktang | last post by:
ONU (Optical Network Unit) is one of the key components for providing high-speed Internet services. Its primary function is to act as an endpoint device located at the user's premises. However,...
0
Oralloy
by: Oralloy | last post by:
Hello folks, I am unable to find appropriate documentation on the type promotion of bit-fields when using the generalised comparison operator "<=>". The problem is that using the GNU compilers,...
0
by: Hystou | last post by:
Overview: Windows 11 and 10 have less user interface control over operating system update behaviour than previous versions of Windows. In Windows 11 and 10, there is no way to turn off the Windows...
0
agi2029
by: agi2029 | last post by:
Let's talk about the concept of autonomous AI software engineers and no-code agents. These AIs are designed to manage the entire lifecycle of a software development project—planning, coding, testing,...

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.