クッキーを利用して、前回開いたページを表示する、タブメニュー。

JavaScript 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html lang="ja">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<style type="text/css">
<!--
  body { background-color:#cce; }
  #menu {
    list-style-type: none;
    margin: 0;
    padding: 0;
  }
  #menu li {
    display: inline;
    border: 1px #888 solid;
    padding: 0;
    margin:0;
  }
  #menu li a {
    color:#088;
  }
  #menu li a:hover {
    color:#ff0;
    background-color:#f0f;
  }
-->
</style>
</head>
<body>

<ol id="menu">
  <li><a href="#menu1">menu1</a></li>
  <li><a href="#menu2">menu2</a></li>
  <li><a href="#menu3">menu3</a></li>
  <li><a href="#menu4">menu4</a></li>
  <li><a href="#menu5">menu5</a></li>
</ol>
<div id="menu1">page.1</div>
<div id="menu2">page.2</div>
<div id="menu3">page.3</div>
<div id="menu4">page.4</div>
<div id="menu5">page.5</div>

<script type="text/javascript">
<!--
//@cc_on @set @V = (@_jscript_version >= 5.5)

var TabMenu = { };

TabMenu.select_css = 'background-color:#600';


TabMenu.add = (function () {
  return function (id) {

    var emt = document.getElementById(id);

    if (undefined === this.List) {
      this.List = [ ];
      this.Initializer();
    }
 
    if (emt) {
      this.List.push(emt);
      this.View(emt);
    }
  };
})();


TabMenu.View = (function (getCookie, setCookie) {
  return function (parent, target) {

    var cnt;
    var obj;
    var tgt;
    var list = parent.getElementsByTagName('A');
    var id;

    if (undefined === target) {
      target = parseInt( getCookie(parent.id) ) || 0;
    }

    if (typeof target == 'number') target = list[target];

    for (cnt = 0; obj = list[cnt]; cnt++) {
      if (id = ('' + obj.getAttribute('href'/*@, 2@*/)).match(/^#(.*)/)[1]) {
        if (tgt = document.getElementById(id)) {
          if (obj === target) {
            tgt.style.display = 'block';
            obj.parentNode.style.cssText = this.select_css;
            setCookie( parent.id, cnt, 100);
          } else {
            tgt.style.display = 'none';
            obj.parentNode.style.cssText = '';
          }
        }
      }
    }
  };
})(

  function (name) {
    name = encodeURIComponent(name).replace(/([.*()])/g, '\\$1');
    var value = document.cookie.match(RegExp(name + '\\s*=\\s*(.*?)(?:[\\s;,]|$)'));
    return value ? decodeURIComponent(value[1]) : '';
  },

  function (name, value, day, path, domain) {
    return document.cookie = encodeURIComponent(name) + '=' + encodeURIComponent(value) +
      '; ' + 'expires=' + new Date( (new Date) - 86400000 * -day ).toUTCString() +
      '; ' + (path ? 'path=' + encodeURI(path) + '; ': '') +
      (domain ? 'domain=' + encodeURI (domain) + '; ': '');
  }
);


TabMenu.Listener = (function (hasParent) {
  return function (evt) {

    var emt = evt./*@if (@V) srcElement @else@*/ target /*@end@*/;
    var cnt = 0;
    var tgt;

    while (tgt = TabMenu.List[cnt++]) {
      hasParent(emt, tgt) && TabMenu.View(tgt, emt);
    }
  };
})(
  //hasParent
  function (n, obj) {
    n = n.parentNode;
    return n ? (n === obj) ? true: arguments.callee(n, obj): false;
  }
);


TabMenu.Finalizer = (function () {
  return function ( evt ) {
    document./*@if (@_jscript) detachEvent('on' + @else@*/ removeEventListener(/*@end@*/
      'click', TabMenu.Listener, false);

    /*@if (@_jscript) detachEvent ('on' + @else@*/ removeEventListener(/*@end@*/
      'unload', TabMenu.Finalizer, false);
  };
})();


TabMenu.Initializer = (function () {
  return function () {
    document./*@if (@_jscript) attachEvent ('on' + @else@*/ addEventListener (/*@end@*/
      'click', TabMenu.Listener, false);

    /*@if (@_jscript) attachEvent ('on' + @else@*/ addEventListener (/*@end@*/
      'unload', TabMenu.Finalizer, false);
  };
})();


TabMenu.add('menu');


//-->
</script>
</body>
</html>