Hi,
I have not understood your examples, but the classical approach with
ajax, from a
server side point of view, is to send the content of the page with
header and footer if it is
an http request and to send only the content if it is ajax.
I think that you can detect an ajax call from the headers of the
request, alternatively you can
just add an "ajax" parameter to all your ajax calls and use it as a
boolean on the serverside to decide what you have to sent, e.g, with or
without header and footer.
-Olivier
zwaldowski wrote:
I currently use the jQuery tabs plugin for displaying a static website
I am working on. Since it's small, I initially just put the four
pages together on one page and let the tabs plugin do its work as
scheduled. Now, it's getting bigger and loading more and more,
therefore making the whole experience slower to load. I already know
that the tabs plugin can load external pages via AJAX, which just
loads the pages from regular anchor links within the tabs.
So, here's my problem. To have the pages external, I would pretty
much just cut-and-paste the contents of that tab into a new HTML file
and have it load externally. But how should I have it degrade?
Having JS disabled is a distinct possibility with this website
(running off a CD + MSIE), so I should ideally have the pages link to
each other with identical headers/footers as the website originally
was. However, taking this approach would have multiple headers and
footers. How should I go about this?
For a more visual approach, check out the following:
Old Site:
|__ index.html
|__ page1.html
|__ page2.html
|__ page3.html
|__ page4.html
All five pages have duplicated headers and footers, save for the tab
bar which has static "selected" classes. They link to each of the
other four pages.
New Site: (Bulgy, slow)
|__ index.html
-|------ Header
-|------ Tabs
-|------ Contents of home
-|------ Contents of page 1 (hidden by JS on default)
-|------ Contents of page 2 (hidden by JS on default)
-|------ Contents of page 3 (hidden by JS on default)
-|------ Contents of page 4 (hidden by JS on default)
-|------ Footer
New ideas: (Fast, speedy, and good-looking)
|__ index.html
-|------ Header
-|------ Tabs, links to pages
-|------ Contents of home
-|------ DIV container, loads others
|__ page1.html
|__ page2.html
|__ page3.html
|__ page4.html
-|------ Footer
