How to activate a CSS property according to a variation in PHP code or URL direction?

Question

I change the language in my site using PHP arrays and lang?=. When the user clicks a link to change the language of the site I want this link to keep "pressed" or change to a different color, so the user knows in which version of the site he/she is. How can I activate a CSS property in this situation?

common.php:

    <?php
    session_start();
    header('Cache-control: private'); // IE 6 FIX

    if(isSet($_GET['lang']))
    {
    $lang = $_GET['lang'];

    // register the session and set the cookie
    $_SESSION['lang'] = $lang;

    setcookie("lang", $lang, time() + (3600 * 24 * 30));
    }
    else if(isSet($_SESSION['lang']))
    {
    $lang = $_SESSION['lang'];
    }
    else if(isSet($_COOKIE['lang']))
    {
    $lang = $_COOKIE['lang'];
    }
    else
    {
    $lang = 'en';
    }

    switch ($lang) {
      case 'en':
      $lang_file = 'lang.en.php';
      break;

      case 'es':
      $lang_file = 'lang.es.php';
      break;

      case 'tw':
      $lang_file = 'lang.tw.php';
      break;

      case 'cn':
      $lang_file = 'lang.cn.php';
      break;

      default:
      $lang_file = 'lang.en.php';

    }

include_once 'languages/'.$lang_file;
?>

lang.en.php:

<?php
$lang = array(
    'h1' => 'Hello World',
);
?>

index.php:

<ul id="lang">
    <li><a href="index.php?lang=en">English</a></li>
    <li><a href="index.php?lang=es">Español</a></li>
    <li><a href="index.php?lang=tw">中文(繁體)</a></li>
    <li><a href="index.php?lang=cn">中文(简体)</a></li>
</ul>

Answer 1

You could test the value of $lang in the portion of code that generates the HTML output, and add a CSS-class on the link which corresponds to that language :

<ul id="lang">
    <li><a href="index.php?lang=en" <?php if($lang=='en') {echo 'class="current_language"';} ?>>English</a></li>
    <li><a href="index.php?lang=es" <?php if($lang=='es') {echo 'class="current_language"';} ?>>Español</a></li>
    <li><a href="index.php?lang=tw" <?php if($lang=='tw') {echo 'class="current_language"';} ?>>中文(繁體)</a></li>
    <li><a href="index.php?lang=cn" <?php if($lang=='cn') {echo 'class="current_language"';} ?>>中文(简体)</a></li>
</ul>

Depending on the value of $lang, one of the four links would have the CSS class current_language. Up to you to set it in your CSS file so it highlights the link which has it.

The generated HTML will then look like this (when $lang is 'en') :

<ul id="lang">
    <li><a href="index.php?lang=en" class="current_language">English</a></li>
    <li><a href="index.php?lang=es" >Español</a></li>
    <li><a href="index.php?lang=tw" >中文(繁體)</a></li>
    <li><a href="index.php?lang=cn" >中文(简体)</a></li>
</ul>

(Of course, you'll have to make sure the $lang variable is visible from the portion of code that generates the HTML output)

Answer 2

Just set an 'active' class for the link to the language which is currently in use.

 <li><a href="index.php?lang=en" <?php if ($_GET['lang'] == 'english') echo 'class="active"' ?>>English</a></li>

Then in your CSS, have

  #lang .active {
     font-weight: bold;
 }

Or however you wish to style it.

Answer 3

CSS:

#current
{
  backgroiund-color:#00ff00;
}

html and php

<?php
 $lang = $_GET['lang'];
?>

<ul id="lang">
    <li><a href="index.php?lang=en" <?php if($lang == 'en') {echo 'id="current"';} ?>>English</a></li>
    <li><a href="index.php?lang=es" <?php if($lang == 'es') {echo 'id="current"';} ?>>Español</a></li>

and so on.........