There really isn't any reason to use AJAX get this effect, unless
you're talking about tens of thousands of pages.
Simply start by loading your navigation in an unordered list. Include
all the natural elements and none of the pagination controls.
Then write javascript that will take your unordered list and wrap it
so you get:
<div class="paginated">
<a class="backward"><</a>
<ul class='nav'>....</ul>
<a class="forward">></a>
</div>
or something similar. Then use CSS to position everything how you
want. Your UL is going be how ever wide want and your LI elements are
going to be inline.
Here's the trick, use the CSS clip property to control the visible
contents of the UL. The JavaScript events on your two forward and
backward anchors would then change the clip to show the next window of
stuff.
Adam
On 23-Dec-08, at 6:04 AM, Jeffrey Jones wrote:
Hoi Tim,
Not my site and not my choice unfortunately. I already pointed these
flaws out.
The other problem is that the navigation menus makes use of honking
great images which means that the navigation menu wouldn't fit in
the page if it were displayed in full.
Again I am aware of the drawbacks of such a set-up (I will put in a
sitemap page if I can) but it isn't my site and the owner has
definite ideas about how he wants it to look, it is very much form
over function.
Cheers
Arj
Tim Gossett wrote:
On Tue, Dec 23, 2008 at 4:20 AM, Jeffrey Jones <[email protected]> wrote:
Lets say I have a simple Radiant based site. Pages with sub-pages
etc etc.
All very simple.
However the user wants the navigation menu to be scrollable using
little
buttons Like the following
NAV1 - NAV2- NAV3- NAV4 <>
Clicking the > button would change the nav to
NAV5 - NAV6- NAV7- NAV8 <>
and so on using AJAX to update the navigation menu. This
navigation menu is
going to be on the one layout this site will use so all the pages
will have
it without exception. Now, how can I do this?
If you rely on AJAX to bring in parts of the navigation menu, then
your site
won't work for users without JavaScript enabled (read: Google won't
be able
to use the navigation menu). Also, you'll be creating superfluous
requests
to load a little bit of HTML, which is a big performance hit. Why
not do
this:
Have your layout create a list with all of the navigation links
that might
otherwise be loaded by AJAX. (This will ensure that the site works
for
non-JS users). Use JS to hide all but the first four nav links when
body.onLoad. Bind a function to your little buttons .onClick to
hide those
four and show the next four nav links.
Your users won't have to wait for an HTTP request to complete
before they
can see the nav links they want, and your menu will be wicked-fast,
leaving
some headroom for sexy animations (slides, fades, etc.).
No need to write an extension.
--
Tim
_______________________________________________
Radiant mailing list
Post: [email protected]
Search: http://radiantcms.org/mailing-list/search/
Site: http://lists.radiantcms.org/mailman/listinfo/radiant
_______________________________________________
Radiant mailing list
Post: [email protected]
Search: http://radiantcms.org/mailing-list/search/
Site: http://lists.radiantcms.org/mailman/listinfo/radiant
_______________________________________________
Radiant mailing list
Post: [email protected]
Search: http://radiantcms.org/mailing-list/search/
Site: http://lists.radiantcms.org/mailman/listinfo/radiant
