Want to win a PS4? Go Premium and enter to win our High-Tech Treats giveaway. Enter to Win

x
?
Solved

Change two iFrames with one link

Posted on 2012-03-21
5
Medium Priority
?
474 Views
Last Modified: 2012-04-19
Is there a way to make two iframes change to different pages with one external link on the main page? I want to make a page show one image and one content with the click. I have both frames working but the user has two click two different links. Is there a away to make one link change both at the same time?
0
Comment
Question by:Turfimage
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 3
  • 2
5 Comments
 
LVL 17

Expert Comment

by:bigeven2002
ID: 37750646
Hello,

Changing 2 iframe sources with one click would require javascript.

<html>
<body>
<script language="javascript" type="application/javascript">
function framechange(x,y){
    document.getElementById('iframe1').src = x;
    document.getElementById('iframe2').src = y;
}
</script>

<p>
<a href="#" onclick="framechange('image.jpg','content.html');">Click here to change iframes</a>
</p>

<iframe id="iframe1" src="" width="250" height="250" ></iframe>
<br /><br />
<iframe id="iframe2" src="" width="250" height="250" ></iframe>

</body>
</html>

Open in new window


The parameters are relative path to the main document.  You can put an absolute path in there if you wanted as well.
0
 

Author Comment

by:Turfimage
ID: 37791172
What if I had two iframez "iframez" and "iframezTOC" and I wanted one link "Read" to change both the iframez?

Would I change this? I cant seem to get it to work right.

document.getElementById('iframe1').src = x;
document.getElementById('iframe2').src = y;
0
 
LVL 17

Expert Comment

by:bigeven2002
ID: 37791517
Can you post the full code you are currently trying?
0
 

Author Comment

by:Turfimage
ID: 37791931
http://timapserver.com/lettis/ceus-ssc-2/Report/Chapter1.html
Here is the site I left the java script but took out the link code so it would work for now... I'm trying to make the "HTML" link on the right open both iframez at once... The larger reading pane is called "iframez" and the navigation is called "iframezTOC". If you open the PDF link or search link you will see that the HTML link needs to open both the chapter.HTML and the table of contents HTML. Thank you for your help
0
 
LVL 17

Accepted Solution

by:
bigeven2002 earned 800 total points
ID: 37792259
Thanks for posting, but since you took the link code out, I can't see the error.  Looking at the anchor tag for View HTML though, this should work:
<a href="#" onclick="framechange('Chapter1/1Info.html','Chapter1/1TOC.html');"> View HTML</a>

Open in new window


If this failed last time like this, maybe the arguments are pointing to the wrong path.  You might need to make the path absolute:
<a href="#" onclick="framechange('/lettis/ceus-ssc-2/Report/Chapter1/1Info.html','/lettis/ceus-ssc-2/Report/Chapter1/1TOC.html');"> View HTML</a>

Open in new window

0

Featured Post

Understanding Web Applications

Without even knowing it, most of us are using web applications on a daily basis. Gmail and Yahoo email, Twitter, Facebook, and eBay are used by most of us daily—and they are web applications. We often confuse these web applications tools for websites.  So, what is the difference?

Question has a verified solution.

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

Although a lot of people devote their energy toward marketing for specific industries, there are some basic principles that can be applied to any sector imaginable. We’ll look at four steps to take and examine how those steps were put into action fo…
Ready to get certified? Check out some courses that help you prepare for third-party exams.
Viewers will get an overview of the benefits and risks of using Bitcoin to accept payments. What Bitcoin is: Legality: Risks: Benefits: Which businesses are best suited?: Other things you should know: How to get started:
Learn how to create flexible layouts using relative units in CSS.  New relative units added in CSS3 include vw(viewports width), vh(viewports height), vmin(minimum of viewports height and width), and vmax (maximum of viewports height and width).
Suggested Courses

618 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