High-end stuff

[lamemp3]

Hi guys, I'm looking for some advice.

I'm looking to code a site of a specific design involving a static background image and a centered dynamic site overlay with accessible menus and options therein.

The overlay as such will sit on a background that will have no interactive qualities but I'm looking to do this so that the site presented is only and entirely loaded in to one 'page' for the user's access... I've seen this technique demonstrated many times on a variety of different sites but for the life of me I can't think of any right now.

I'm looking for the most simple to set up or the easiest technique to learn/implement, if there's a template that anyone knows about that could easily demonstrate the fundamentals of what I'm trying to do I could most likely hack the rest of it together.

I know and understand basic HTML/CSS and a bit of JavaScript pretty well... I've touched on PHP coding a fair bit for practical but not really decorative matters. This will also be the first time I'll be working with a graphic designer as well, so the techniques I'll be using in the design will appear very minimalistic but I suspect this kind of thing might require heavy coding depending on how it's done.

Any pointers to even any tutorials or leads in to the right directions would be heavily appreciated.

[Sean@WMS]

Originally Posted by lamemp3

Hi guys, I'm looking for some advice.

I'm looking to code a site of a specific design involving a static background image and a centered dynamic site overlay with accessible menus and options therein.

I must be missing somehting here, as this is super simple to do.

The overlay as such will sit on a background that will have no interactive qualities but I'm looking to do this so that the site presented is only and entirely loaded in to one 'page' for the user's access... I've seen this technique demonstrated many times on a variety of different sites but for the life of me I can't think of any right now.

Are you trying to password protect access? I don't otherwise understand what you are wanting here. Or are you looking at sites made completely of FLASH? It would be REALLY helpfull if you could provide an example.

[lamemp3]

Well, ideally the entire site itself should be displayed all in one single HTML file so I don't have to click links that lead to other pages.

I really have absolutely no Flash knowledge, or even Flash software whatsoever but what I'm looking to do is fairly simple... The content or body of the site itself will all need to be on one page, perhaps having other parts of it loading when a JavaScript link is clicked. I'm hoping that if this is such an easy technique I could come across some kind of easily replicable/appliable code and/or a template that I can modify to go knock something up and then tweak the look of it for perfection.

I'm not doing this profit and I'm really confused as to what might be the best way to do it... It's not so easy to me, mainly because I've never done it before. Should I just use CSS to do this? I'm not sure if there are tags for this kind of purpose or not, hence why I'm stuck and I'm looking for just a little bit of help to push me in the right direction.
Maybe it's just been a while for me, too long to remember but this genuinely seems daunting.

I'm really not looking for a step-by-step, though. Just an idea as per how this could be easily done...

I seem to be getting more confused by the minute, actually. Looking in to old code and trying to find my feet.

I'll try to demonstate an example, just to give an idea...



Ok, basically in this image there's the background image and the overlay box... The inside of overlay needs to be dynamic in the respect that the horizontal menu bar will remain where it is but clicking any corresponding option in the menu will change what is displayed in the inner-most box.
This, as far as I know is a fairly standard sort of design but I'm totally just at a loss, first and foremost to create this dynamic box and then secondly to keep the page in place, as the page should not load again when a menu link is clicked but rather the content in the innermost box should be replaced and/or that it should be preloaded already and ready to be accessed...

I hope this helps.

[Sean@WMS]

I think you are looking to dive in WAY over your head.

But for an experienced developer, none of this should present a challenge.

[cashcannon]

If you want to use css and a little javascript you can wrap your content pages in divs in the main html and use the display function to turn it on or off depending on what content you want to show.

[jump]

Originally Posted by lamemp3

Well, ideally the entire site itself should be displayed all in one single HTML file so I don't have to click links that lead to other pages.

To me, it looks as though frames could be used for this job.
http://htmlhelp.com/design/frames/usage/

You could also use a Javascript Dropdown Document Viewer which displays the content in an iframe:
http://www.dynamicdrive.com/dynamici...opdownview.htm

Obviously, this method requires a drop-down menu instead of your regular nav links.

These methods do not work in all browsers. What this means is that extra work may be required in order to provide alternative viewing solutions.

[Sean@WMS]

Originally Posted by jump

To me, it looks as though frames could be used for this job.
http://htmlhelp.com/design/frames/usage/

You could also use a Javascript Dropdown Document Viewer which displays the content in an iframe:
http://www.dynamicdrive.com/dynamici...opdownview.htm

Obviously, this method requires a drop-down menu instead of your regular nav links.

These methods do not work in all browsers. What this means is that extra work may be required in order to provide alternative viewing solutions.

With all due respect to Jump, don't go with frames ( worst case, use CSS overflow rather than frames ).

Otherwise, I stick with my initial assement.

I could help you out for a consulting fee if you are interested.

[itrends]

There are plenty of DTHML/Ajax tools that might be able to help you. Try googling "free ajax" or something like that to find sites that offer such things. I like dhtmlgoodies dot com personally.

[&Ingonyama]

If I understand you correctly mootools would be a nice solution:

mootools ajax example: http://demos.mootools.net/Ajax