>>From: Paul Novitski <[EMAIL PROTECTED]>
>>Here's an example of one technique that I
>>produced using English & Japanese text:
>>http://laurietobyedison.com/WOJwords.asp?lang=EN
>>
>>Every bilingual page on the site contains both
>>languages, with only one of them displayed at a time.
>>
>>In the absence of javascript, the
>>Japanese/English toggle requests the current
>>page from the server with the requested
>>language selected (by specifying it in the body class).
>>
>>With javascript enabled, the language toggle
>>simply switches the body class and the displayed language changes immediately.
At 3/5/2007 06:28 PM, Chris Chen wrote:
>Could you elaborate a bit on what you mean by
>"switch body class" with a simple example?
Hi Chris,
Here's one example of this technique. Plug the
requested language into the body class:
<body class="langEN">
or
<body class="langES">
then mark up language-specific strings in the page:
<p class="langEN">This is English</p>
<p class="langES">Esto es español</p>
Then you can style:
/* first hide all the language-specific paragraphs */
p.langEN,
p.langES
{
position: absolute;
left: -1000em;
}
/* now show the current language */
body.langEN p.langEN,
body.langES p.langES
{
position: static;
}
The body class can be changed either by a
server-side script while the page is being
constructed or by a client-side script while the page is being used.
In other situations, I use the body id & class to
target styling rules to particular pages from within a global stylesheet:
<body id="index">
or
<body id="about">
then:
/* highlight the nav menu item for the current page */
body#index ul#nav li.index,
body#about ul#nav li.about
{
color: #F00;
}
Regards,
Paul
__________________________
Paul Novitski
Juniper Webcraft Ltd.
http://juniperwebcraft.com
______________________________________________________________________
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
