PDA

View Full Version : need code to swap out pages after clicking a link or button



wecandoit
03-11-2014, 03:02 PM
so I have an iframe.html and a index.html page.... the fixed iframe is across the top of the page and should act kind of as the navigation menu... I want to put 3 links in the iframe that when clicked on will change the index page to a different one..

for example: clicking link 1 from the iframe will change the index.html to index2.html and so on.....

is there code anywhere that I can use for that?

Beverleyh
03-11-2014, 06:22 PM
Sounds like you need to use the target attribute and possibly a named iframe. However without seeing a live mock-up, its hard to visualise what you're describing.

The following responses should help: http://www.w3schools.com/tags/att_a_target.asp and http://www.w3schools.com/tags/att_iframe_name.asp

If you need more help, please provide a link to your page.

molendijk
03-11-2014, 09:06 PM
You should do it the other way round. Navigation menu in the main page, content pages in the iframe. Example:

<!doctype html>
<html >
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">

<title></title>

<style>
body {font-family: verdana; font-size: 12px; background: #dedede}
</style>

</head>

<body >

<div style="position: relative; text-align: center">
<a href="javascript: void(0)" onclick="location.search='http://www.dynamicdrive.com'">DynamicDrive</a>
<a href="javascript: void(0)" onclick="location.search='http://www.dynamicdrive.com/forums'">DynamicDriveForums</a>
<a href="javascript: void(0)" onclick="location.search='http://edition.cnn.com'">CNN</a>
</div>

<iframe name="ifr" style="position:absolute; left:10%; top: 10%; width:80%; height: 80%; background: white" src="http://www.dynamicdrive.com"></iframe>

<script>
var data=location.search;
if(data)
{
data = location.search.substring(1); // needed to remove the '?'
ifr.location.replace(data)
data=''
}
</script>

</body>

</html>
This method is bookmarking friendly.

wecandoit
03-12-2014, 09:53 AM
How do I remove the borders of the iframe? frameborder=0 does not work..

also scrolling=no doesn't work either

molendijk
03-12-2014, 10:41 AM
This will work:

<iframe name="ifr" style="position:absolute; left:10%; top: 10%; width:80%; height: 80%; background: white" src="http://www.dynamicdrive.com" scrolling="no" frameborder="0"></iframe>