Need debugger to help me

H

heather.memmel

I am in no way a scripter/programmer of any kind but I am in charge of
a number of online videos. Anyway I need help debugging my javascript
which has been pieced together from several other posts/people in
relation to the topic of reloading two frames from a link in a image
map. Here is the code it doesn't work, Please Help!

You can check out the live page at

http://www.maddash.net/videos/oakwood

<html>
<head>
<title>Oakwood</title>
<meta http-equiv="Content-Type" content="text/html;
charset=iso-8859-1">

<script language="javascript">
function update1() {
Top.Video.location="oakwood_wmhs.htm";
Top.Selector.location="selector_oakwood.htm"; }

function update2() {
Top.Video.location="driessche_wmhs.htm";
Top.Selector.location="selector_driessche.htm"; }

function update3() {
Top.Video.location="wilson_wmhs.htm";
Top.Selector.location="selector_wilson.htm"; }

function update4() {
Top.Video.location="bradley_wmhs.htm";
Top.Selector.location="selector_bradley.htm"; }
</script>
</head>

<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
<img src="submenu.jpg" width="297" height="480" border="0"
usemap="#Map">
<map name="Map">
<area shape="rect" coords="172,7,285,30"
href="javascript:eek:nClick=update1();" alt="Main Video">
<area shape="rect" coords="27,166,283,248"
href="javascript:eek:nClick=update2();" alt="Annmarie Driessche">
<area shape="rect" coords="28,253,269,334"
href="javascript:eek:nClick=update3();" alt="Sandy Wilson">
<area shape="rect" coords="28,338,266,423"
href="javascript:eek:nClick=update4();" alt="Anne Marie Bradley">
<area shape="rect" coords="248,445,290,472"
href="http://www.maddash.net/videos/troubleshoot.htm" target="_blank"
alt="Help!">
</map>
</body>
</html>
 
L

Lee

(e-mail address removed) said:
I am in no way a scripter/programmer of any kind but I am in charge of
a number of online videos. Anyway I need help debugging my javascript
which has been pieced together from several other posts/people in
relation to the topic of reloading two frames from a link in a image
map. Here is the code it doesn't work, Please Help!
Click to expand...


When copying code that you don't understand, you need to copy
very carefully. Don't use "Top" if the original code said "top".
Don't combine: href="javascript:" onClick="update1()"
into: href="javascript:eek:nClick="update1()"
 
I

Ivo

... the topic of reloading two frames from a link in a image
map. Here is the code it doesn't work, Please Help!

function update1() {
Top.Video.location="oakwood_wmhs.htm";
Top.Selector.location="selector_oakwood.htm"; }
Click to expand...

The topmost window should be referenced as "top" with a lowercase "t".
Also, in your HTML frameset, the name of the frame is "Select", not
"Selector" (I'd use a less confusing name btw). In short, changing the
function as follows should do the trick:

function update1() {
top.frames.Video.location="oakwood_wmhs.htm";
top.frames.Select.location="selector_oakwood.htm"; }

hth
 
H

heather.memmel

I updated the code to as follows but I am getting the following errors:

update1 is not defined
update2 is not defined
update3 is not defined
update4 is not defined

<html>
<head>
<title>Oakwood</title>
<meta http-equiv="Content-Type" content="text/html;
charset=iso-8859-1">
<script language="javascript">
function update1() {
top.frames.Video.location="oakwood_wmhs.htm";
top.frames.Selector.location="selector_oakwood.htm"; }

function update2() {
top.frames.Video.location="driessche_wmhs.htm";
top.frames.Selector.location="selector_driessche.htm"; }

function update3() {
top.frames.Video.location="wilson_wmhs.htm";
top.frames.Selector.location="selector_wilson.htm"; }

function update4() {
top.frames.Video.location="bradley_wmhs.htm";
top.frames.Selector.location="selector_bradley.htm"; }
</script>
</head>

<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
<img src="submenu.jpg" width="297" height="480" border="0"
usemap="#Map">
<map name="Map">
<area shape="rect" coords="172,7,285,30" href="javascript:"
onClick="update1()" alt="Main Video">
<area shape="rect" coords="27,166,283,248" href="javascript:"
onClick="update2()" alt="Annmarie Driessche">
<area shape="rect" coords="28,253,269,334" href="javascript:"
onClick="update3()" alt="Sandy Wilson">
<area shape="rect" coords="28,338,266,423" href="javascript:"
onClick="update4()" alt="Anne Marie Bradley">
<area shape="rect" coords="248,445,290,472"
href="http://www.maddash.net/videos/troubleshoot.htm" target="_blank"
alt="Help!">
</map>
</body>
</html>
 
R

RobB

I updated the code to as follows but I am getting the following errors:

update1 is not defined
update2 is not defined
update3 is not defined
update4 is not defined

<html>
<head>
<title>Oakwood</title>
<meta http-equiv="Content-Type" content="text/html;
charset=iso-8859-1">
<script language="javascript">
function update1() {
top.frames.Video.location="oakwood_wmhs.htm";
top.frames.Selector.location="selector_oakwood.htm"; }

function update2() {
top.frames.Video.location="driessche_wmhs.htm";
top.frames.Selector.location="selector_driessche.htm"; }

function update3() {
top.frames.Video.location="wilson_wmhs.htm";
top.frames.Selector.location="selector_wilson.htm"; }

function update4() {
top.frames.Video.location="bradley_wmhs.htm";
top.frames.Selector.location="selector_bradley.htm"; }
</script>
</head>

<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
<img src="submenu.jpg" width="297" height="480" border="0"
usemap="#Map">
<map name="Map">
<area shape="rect" coords="172,7,285,30" href="javascript:"
onClick="update1()" alt="Main Video">
<area shape="rect" coords="27,166,283,248" href="javascript:"
onClick="update2()" alt="Annmarie Driessche">
<area shape="rect" coords="28,253,269,334" href="javascript:"
onClick="update3()" alt="Sandy Wilson">
<area shape="rect" coords="28,338,266,423" href="javascript:"
onClick="update4()" alt="Anne Marie Bradley">
<area shape="rect" coords="248,445,290,472"
href="http://www.maddash.net/videos/troubleshoot.htm" target="_blank"
alt="Help!">
</map>
</body>
</html>
Click to expand...

Replace the double 'slanted' quotes here:

<script language="javascript">

....with HTML-standard 'curly' doubles. Helps get those functions
declared.

Also: add ------> return false;
as the final line in each 'update' function, and call them like so:

<area shape="rect" coords="172,7,285,30" href="some_url"
target="_blank"
onclick="return update1()" alt="Main Video">

'some_url' should download a meaningful page of some sort for those
with JS disabled.
 
R

Randy Webb

RobB said:
(e-mail address removed) wrote:
Click to expand...

Replace the double 'slanted' quotes here:

<script language="javascript">

....with HTML-standard 'curly' doubles. Helps get those functions
declared.
Click to expand...

No, stop using the language attribute and use the type attribute instead:

<script type="text/javascript">
 
I

Ivo

(e-mail address removed) wrote
Click to expand...

Hi, I took all and more tips together in th following code. You 'll note
that there is only one function update(), which takes the link as parameter.
All links are hardcoded in the HTML for the js-less, and converted to the
appropriate url's in the javascript. This is possible thanks to your already
consistent naming scheme.

<html><head><title>Oakwood</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<script type="text/javascript">

function update(s) { s=s.href;
top.frames.Video.location.href=s;
top.frames.Select.location.href=s.replace( /(\w+)_wmhs/, 'selector_$1' );
return false;
}

</script>
</head>
<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
<img src="submenu.jpg" width="297" height="480" border="0" usemap="#Map">
<map name="Map">
<area shape="rect" coords="172,7,285,30" href="oakwood_wmhs.htm"
onclick="return update(this);" target="Video" alt="Main Video">
<area shape="rect" coords="27,166,283,248" href="driessche_wmhs.htm"
onclick="return update(this);" target="Video" alt="Annmarie Driessche">
<area shape="rect" coords="28,253,269,334" href="wilson_wmhs.htm"
onclick="return update(this);" target="Video" alt="Sandy Wilson">
<area shape="rect" coords="28,338,266,423" href="bradley_wmhs.htm"
onclick="return update(this);" target="Video" alt="Anne Marie Bradley">
<area shape="rect" coords="248,445,290,472"
href="/videos/troubleshoot.htm" target="_blank" alt="Help!">
</map>
</body>
</html>
 
D

DU

I am in no way a scripter/programmer of any kind but I am in charge of
a number of online videos. Anyway I need help debugging my javascript
which has been pieced together from several other posts/people in
relation to the topic of reloading two frames from a link in a image
map. Here is the code it doesn't work, Please Help!

You can check out the live page at

http://www.maddash.net/videos/oakwood

<html>
<head>
<title>Oakwood</title>
<meta http-equiv="Content-Type" content="text/html;
charset=iso-8859-1">

<script language="javascript">
function update1() {
Top.Video.location="oakwood_wmhs.htm";
Top.Selector.location="selector_oakwood.htm"; }
Click to expand...

I suggest you use this form (for better cross-browser support) rather:

function update1() {
top.frames["Video"].location.href = "oakwood_wmhs.htm";
top.frames["Selector"].location.href = "selector_oakwood.htm"; }

Note that it's top, not Top.
function update2() {
Top.Video.location="driessche_wmhs.htm";
Top.Selector.location="selector_driessche.htm"; }

function update3() {
Top.Video.location="wilson_wmhs.htm";
Top.Selector.location="selector_wilson.htm"; }

function update4() {
Top.Video.location="bradley_wmhs.htm";
Top.Selector.location="selector_bradley.htm"; }
</script>
</head>

<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
Click to expand...

leftmargin="0" topmargin="0" marginwidth="0" marginheight="0" are all
non-standard. If you really want your frame to have no margins, then use
the proper attributes (marginwidth marginheight) on the frame:
http://www.w3.org/TR/html4/present/frames.html#adef-marginheight
http://www.w3.org/TR/html4/present/frames.html#adef-marginwidth
and define a css rule for the body node in the framed document.
<img src="submenu.jpg" width="297" height="480" border="0"
usemap="#Map">
<map name="Map">
<area shape="rect" coords="172,7,285,30"
href="javascript:eek:nClick=update1();" alt="Main Video">
Click to expand...

Do not use href="javascript:eek:nClick=update1();": this does not make
really any sense.
I suggest you avoid an image map for this and use real HTML buttons.

<button type="button" onclick="update1();">View main video</button>

otherwise, at least, use the onclick event handler and the nohref
attribute accordingly
http://www.w3.org/TR/html4/struct/objects.html#adef-nohref

DU
 
H

honion

Thanks! Everything is working except that I get a blank JavaScript
Console window when testing in Firefox 1.0.2. There are no errors but
after clearing the caches and restarting I still get a blank window
 

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Similar Threads

need help on image map 2
Help me sort out this script 1
I need help fixing my website 2
need help on highlighting image map area 1
Please Help? 0
Help with my responsive home page 2
Coding problem 13
I need help making a zooming function 11

Members online

Total: 74 (members: 1, guests: 73)
Robots: 423

Forum statistics

Threads
473,994
Messages
2,570,223
Members
46,813
Latest member
lawrwtwinkle111

Latest Threads

Top