PDA

View Full Version : Can I Do This With Html?



Quamen
24th June 2005, 01:10 PM
Hi guys,
Hopefully somebody here has an answer for me :)

What I want to do is be able to create a webpage where the menu system doesn't have to reload a new page, it merely loads a html file into the current page to display the appropiate content.

It's kind of like frames, but I don't want to use frames. I want to use CSS. Kind of load a whole html file into a DIV box kind of deal...i Think.

Basically I want to make updating the page easier. The template will remain the same, but if I change the conent I can just upload a seperate content file. I also want the menu's to be in a seperate file, so that I don't have to go through every single page to find and update menu's, just update it in one place.

I guess I kind of want object orientated web design.....Can I do this with html? Or am I going to need something more powerfull?

If this didn't make sense then let me know and I'll try and give a better example.

iSlayer
24th June 2005, 01:22 PM
ah fianlly something for me to answer :)

you will need to test with every browser you can when using a method like this.

You will need to use javascript to do it all aswell.
Essentially each menu item will have an onmousedown or onclick event(best to use onclick).
The event will call a function

so it might be menu_1.jpg

you may choose to have a different function for each page or you can have a single function and pass an argument to it like this

menu_1.jpg

Your javascript for actually changing the content would be something like this

document.getElementById("div_id").innerHTML="newpage.html"

I hope that helps.
feel free to give me a yell if you need any more help

Quamen
24th June 2005, 01:49 PM
ok so lets make sure I understand this.

Effectively I can make each menu item call a javascript function that will replace the code in number of DIV element blocks on a webpage?

Time for me to start playing then I guess :)

iSlayer
24th June 2005, 01:51 PM
yep.
make sure you do alot of testing as i said to make sure it works in all browsers

Graham
24th June 2005, 04:51 PM
There's a few good articles on techniques for this (and lots on others) at http://www.alistapart.com/ which promotes CSS and cross-browser coding.

maelgwn
24th June 2005, 05:16 PM
Maybe i misunderstood but would this be easier with php?

Ie the php which first loads the menu/header and then the page you want below. then make the links in the menu to something like index.php?page=link.html

Was thinking a php file like this like this

<?
include('header.xhtml');
if(!empty($_GET['page'])) { include($_GET['page']); }
else { include('frontpage.xhtml'); }
?>

Currawong
24th June 2005, 06:56 PM
The latest Gallery (PHP-based photo gallery) has a set-up menu that does this using CSS. Maybe download it and have a look what code they use?

sikosis
28th June 2005, 01:53 PM
islayer is on the right path ...

use DHTML, CSS and JS

maelgwn
28th June 2005, 06:40 PM
to trying to put you down, but my method would work right? i think it achieves what he wants ... so why choose one over the other?

sikosis
5th August 2005, 01:27 PM
it was mainly because he asked for "where the menu system doesn't have to reload a new page"

also in your code, you should put <?php and not <? otherwise there&#39;s a way of viewing the php code without executing it. This was a security problem awhile back. just giving you a heads up.