Member Avatar for bidbul

hello, can you please help me?

i wanted some clickable texts which opens not 1 but 2 urls in 2 different iframes.

this code works on ie and opera but not on ff.
i don't know what to do.
thanks!

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">

<script language="javascript">
function linx(url1,url2){
document.frames["spec"].window.location.href=url1;
document.frames["pro"].window.location.href=url2;
}
</script>

</head>

<body>

  <iframe src="intro.html" frameborder="0" height="433" width="433" name="spec" marginheight="0" marginwidth="0" vspace="0" hspace="0" scrolling="auto"></iframe>


<a href="#" onClick="linx('a1.html', 'a2.html')">111111111</a> <br />
<a href="#" onClick="linx('b1.html', 'b2')">222222222</a><br />
<a href="#" onClick="linx('c1.html', 'c2.html')">3333333</a><br />
<a href="#" onClick="linx('d1.html', 'd2.html')">4444444444</a></a>


<iframe src="products_image.html" frameborder="0" height="400" width="200" name="pro" marginheight="0" marginwidth="0" vspace="0" hspace="0" scrolling="auto"></iframe>


</body>
Edited by bidbul because: n/a
  • 2 Contributors
  • 2 Replies
  • 172 Views
  • 10 Hours Discussion Span
  • Latest Post Latest Post by bidbul
Member Avatar for bhartman21

hello, can you please help me?

i wanted some clickable texts which opens not 1 but 2 urls in 2 different iframes.

this code works on ie and opera but not on ff.
i don't know what to do.
thanks!

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">

<script language="javascript">
function linx(url1,url2){
document.frames["spec"].window.location.href=url1;
document.frames["pro"].window.location.href=url2;
}
</script>

</head>

<body>

  <iframe src="intro.html" frameborder="0" height="433" width="433" name="spec" marginheight="0" marginwidth="0" vspace="0" hspace="0" scrolling="auto"></iframe>


<a href="#" onClick="linx('a1.html', 'a2.html')">111111111</a> <br />
<a href="#" onClick="linx('b1.html', 'b2')">222222222</a><br />
<a href="#" onClick="linx('c1.html', 'c2.html')">3333333</a><br />
<a href="#" onClick="linx('d1.html', 'd2.html')">4444444444</a></a>


<iframe src="products_image.html" frameborder="0" height="400" width="200" name="pro" marginheight="0" marginwidth="0" vspace="0" hspace="0" scrolling="auto"></iframe>


</body>

Give this a try:

Change the (name=spec) property of the iFrame to an id....(id="spec") ...then the same with the "pro" iFrame...then modify your lines below:

document.frames["spec"].window.location.href=url1;
document.frames["pro"].window.location.href=url2;

make the two lines look like this...

document.getElementById("spec").src=url1;
document.getElementById("pro").src=url2;


......

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">

<script language="javascript">

function linx(url1,url2)
{
document.getElementById("spec").src=url1;
document.getElementById("pro").src=url2;
}

</script>
</head>

<body>
<iframe src="intro.html" frameborder="0" height="433" width="433" id="spec" marginheight="0" marginwidth="0" vspace="0"

hspace="0" scrolling="auto"></iframe>

<br />
<a href="#" onClick="linx('http://www.google.com', 'http://www.msdn.com')">111111111</a>
<br />
<a href="#" onClick="linx('http://www.daniweb.com', 'http://www.technet.com')">222222222</a>
<br />
<a href="#" onClick="linx('http://www.hotmail.com', 'http://www.google.com')">3333333</a>
<br />
<a href="#" onClick="linx('http://www.asp.net', 'http://www.microsoft.com')">4444444444</a>
<br />

<iframe src="products_image.html" frameborder="0" height="400" width="200" id="pro" marginheight="0" marginwidth="0"

vspace="0" hspace="0" scrolling="auto"></iframe>

</body>
</html>

Edited by bhartman21 because: Adding the code for the suggestion...
Member Avatar for bidbul

brilliant! now works perfectly!
bhartman21, thank you for your help!

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.