ZuoTi.Pro
Question

1) With the partial code below, create a web page that looks like the one below and complete the given code. Make sure work that the correct image corresponding with the correct hyperlink is displayed in the right frame whilst all the hyperlinks are listed in the left frame.

<html>

<head>

<script>

function setImage(index)

{

    if (index == 1)

    {

      RightFrame.document.RightImage.src = "lions.jpg";

    }

    if (index == 2)

    {

      RightFrame.document.RightImage.src = "tigers.jpg";

    }

return;

}

</script>

</head>

<frameset cols="20%,*">

<"LeftFrame" src="left9rvw.html">

<"RightFrame" src="right9rvw.html">

</frameset>

</html>



ANIMAL IMAGES Lions Tigers Bears Camels Zebras Elephants
engineering   Computer-Science   
0 0
Add a comment Improve this question Transcribed image text
Next > < Previous
Sort answers by oldest

Homework Answers

Answer #1

Code for following:

<html>

<head>
<body>
<h2> ANIMAL IMAGES </H2>
<br>
<br> <a $id="1" href="img.jpg">Lions</a>
<br> <a $id="2" href="#news">Tigers</a>
<br> <a $id="3" href="#news">Bears</a>
<br> <a $id="4" href="#news">Camels</a>
<br> <a $id="5" href="#news">Zebras</a>
<br> <a $id="6" href="#news">Elepahnts</a>

<script>
function setImage(id)

{

if (id == 1)

{

RightFrame.document.RightImage.src = "lions.jpg";

}

if (id == 2)

{

RightFrame.document.RightImage.src = "tigers.jpg";

}
if (id == 3)

{

RightFrame.document.RightImage.src = "Bears.jpg";

}

if (id == 4)

{

RightFrame.document.RightImage.src = "Camels.jpg";

}

if (id == 5)

{

RightFrame.document.RightImage.src = "Zebras.jpg";

}

if (id == 6)

{

RightFrame.document.RightImage.src = "Elephants.jpg";

}

return;

}

</script>

</head>


<frameset cols="20%,*">

<"LeftFrame" src="left9rvw.html">

<"RightFrame" src="right9rvw.html">

</frameset>

</body>
</html>

Because Frame tag not supported in HTML5 this may casue problem but it perfectly work HTML(Simple)

This may be the good solution.

<html>
<head>
<title>Assignment</title>

<script>
function setImage(index)
{
parent.frames.RightFrame.window.postMessage(index);
return;
}
</script>
</head>
<body>
<br> <a $id="1" href="img.jpg">Lions</a>
<br> <a $id="2" href="#news">Tigers</a> //#news reffer to image address
<br> <a $id="3" href="#news">Bears</a>
<br> <a $id="4" href="#news">Camels</a>
<br> <a $id="5" href="#news">Zebras</a>
<br> <a $id="6" href="#news">Elepahnts</a>
<script>
window.addEventListener("message",function(e)
{
alert(e.data);
setImage(e.data);
});

function setImage(index)
{
if (index == 1)
{
document.getElementById("RightImage").src = "lion.jpg";
}
if (index == 2)
{
document.getElementById("RightImage").src = "tiger.jpg";
}
if (index == 3)
{
document.getElementById("RightImage").src = "bears.jpg";
}
if (index == 4)
{
document.getElementById("RightImage").src = "camels.jpg";
}
if (index == 5)
{
document.getElementById("RightImage").src = "zebras.jpg";
}
if (index == 6)
{
document.getElementById("RightImage").src = "Elephants.jpg";
}
return;
}
</script>
<img src="wt.gif" id="RightImage" >
<frameset cols="20%,*">
<frame name="LeftFrame" src="left3.html">
<frame name="RightFrame" src="right1.html">
</frameset>
</body>
</html>

//Leave comment if any query

0 0
Add a comment
Know the answer?
Add Answer to:
1) With the partial code below, create a web page that looks like the one below...
Your Answer:

Post as a guest

Your Name:

What's your source?

Earn Coins

Coins can be redeemed for fabulous gifts.

Log In

Sign Up

Not the answer you're looking for? Ask your own homework help question. Our experts will answer your question WITHIN MINUTES for Free.
Similar Homework Help Questions

  • HTML 5 and w3 validated with no errors Please ! 1. Create a Web page like...

    HTML 5 and w3 validated with no errors Please ! 1. Create a Web page like the following. You can use any set of images, but try to preserve the relative positioning of all items as shown below. Address Favorites CST 6305- Welome to the classhOpen To G Google INDEX Home Pag Instructor: Christo Dichev relative Lab Exercise: Positioning absolite What to turn in: Please submit your images together with the html file to Canvas

  • (b) Write a JavaScript function that displays the 216 web safe colours with their hex values in a 36 × 6 table. In an R...

    (b) Write a JavaScript function that displays the 216 web safe colours with their hex values in a 36 × 6 table. In an RGB colour model, assigning each of the Red, Green, Blue components with a value from [00, 33, 66, 99, CC, FF] will create a web safe colour, for example, #3366FF Use the DOM methods createElement ) and appendChild() to write the function. Working code using other DOM methods may receive partial marks <html> head> <title>Web Safe...

ADVERTISEMENT
Free Homework Help App
Download From Google Play
Scan Your Homework
to Get Instant Free Answers
Need Online Homework Help?
Ask a Question
Get Answers For Free
Most questions answered within 3 hours.
ADVERTISEMENT
ADVERTISEMENT
ADVERTISEMENT