iframe help.. [Archive] - Dynamic Drive Forums

distantweb

02-07-2008, 11:59 PM

Hey all, first post here!

I was searching for a solution for my problem and came across the following thread: http://www.dynamicdrive.com/forums/showthread.php?t=24979

If you have a quick read of the third post down, you'll get some sort of idea of what I'm trying to do with my web-page (which, by the way, is a school project with a deadline of tomorrow.. And I've left it all right until the last minute, not wise!).

However, with my web-site, I'm trying to keep it as bandwidth friendly on the end-user as possible... And so in doing so, am wanting to use links that only change the content within an iframe, rather than have to re-load the whole site every time a link is clicked.

I'm an absolute beginner to PHP, I've never used it before in my life, and was my sole intention of this school project to use the opportunity to learn it (as we had to use an 'advanced programming language' of our own choice). I have been designing web-sites for about 2 years now though, on a more serious level for the past year.

I don't use scripts though. So don't have a clue about anything PHP-based. You wouldn't believe how many Google searches I've done in the last 4 hours, and still have NO PHP in my code at all!

Anyway, back to my initial problem. I want to learn how to basically load three different pages into three different iframes, when the user clicks one link. If I was using just one iframe and loading just one page, this wouldn't be a problem, as I've done this before - all I do is set the <a> target value as the iframe name.

I had an idea that it could work something like this:

<?php
$current_page = home;

if ( current_page == home ) {
mainsection_iframe src="home.htm"
}
else {
mainsection_iframe src="home.htm"
}
if ( current_page == catalogue ) {
mainsection_iframe src="catalogue.htm"
}
else {
mainsection_iframe src="home.htm"
}
?>
<a onclick="<?php $current_page = home ?>" name="link_home">home</a> | <a onclick="<?php $current_page = catalogue ?>" name="link_catalogue">catalogue</a>

<iframe class="content" src="home.htm" name="mainsection_iframe">
</iframe>

Obviously this wouldn't work, but you can get some sort of idea of what I want this to do..!

I don't mind using JavaScript if this is necessary.

Thanks in advance for any responses.. The sooner the better, you'll be saving my ass big time! :o

jackbenimble4

02-09-2008, 03:41 AM

This would be achievable using javascript exclusively. Here's a brief example:

<html>
<head>
<script type="text/javascript">
function changeContent(page) {
var content = document.getElementById("content");
content.src = page + '.htm';
}
</script>
</head>
<body>
<a href="#" onclick="changeContent('catalogue');">Catalogue</a>

<iframe id="content" src="home.htm" name="mainsection_iframe">
</iframe>
</body>
</html>

In that example, when the page loads, home.htm is loaded in the iframe. When the Catalogue link is clicked, catalogue.htm is loaded. You can add more links in the same fashion. I hope that helped.