| 12
 3
 4
 5
 6
 7
 8
 9
 10
 11
 12
 13
 14
 15
 16
 17
 18
 19
 20
 21
 22
 23
 24
 25
 26
 27
 28
 29
 30
 31
 32
 33
 34
 35
 36
 37
 38
 39
 40
 41
 42
 43
 44
 45
 46
 47
 48
 49
 50
 51
 52
 53
 54
 55
 56
 57
 58
 59
 60
 61
 62
 63
 64
 65
 66
 67
 68
 69
 70
 71
 72
 73
 74
 75
 76
 77
 78
 79
 80
 81
 82
 83
 84
 85
 86
 87
 88
 89
 90
 91
 92
 93
 94
 95
 96
 97
 98
 99
 100
 101
 102
 103
 104
 105
 106
 107
 108
 109
 110
 111
 112
 113
 114
 115
 116
 117
 118
 119
 120
 
 | <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" lang="fr">
<body>
<style type="text/css">
/* Div du module */
#menumodule {
    margin: 0;
    padding: 0;
    width: 30%;
}
/* Menu */
#menumanager {
    height: 35px;
    margin: 0;
    padding: 0;
    width: 100%;
}
#menumanager li {
    margin: 0 0 -2px 0;
    list-style: none;
    padding: 0 0 0 2px;
    float: left;
}
#menumanager li a {
    padding: 10px 5px 5px 4px;
    float: left;
}
#menumanager li a:hover {
    border-right: 1px solid #DFD5C3;
    border-left: 1px solid #DFD5C3;
    border-top: 1px solid #DFD5C3;
    background-color: #FFFFF0;
    color: #000000;
}
/* Affichage du menu */
#menumodule .content {
	margin: 0;
	clear: left;
}
#menumodule a.current {
    background-color: #FFFFF0;
    border-left: 1px solid #DFD5C3;
    border-right: 1px solid #DFD5C3;
    border-top: 1px solid #DFD5C3;
}
#menumodule a.ghost  {
	background-color: #E2EBEE;
	border-left: 1px solid #DFD5C3;
    border-right: 1px solid #DFD5C3;
    border-top: 1px solid #DFD5C3;
	margin: 1px 0 0;
    padding: 8px 5px 5px 4px;
}
#menumodule .on {
	display: block;
}
#menumodule .off {
	display: none;
}
 
</style>
<script type="text/javascript">
<!-- Gestion des onglets du menu -->
function multiClass(eltId) {
	arrLinkId = new Array("_0","_1","_2");
	intNbLinkElt = new Number(arrLinkId.length);
	arrClassLink = new Array("current","ghost");
	strContent = new String()
	for (i=0; i<intNbLinkElt; i++)
	{
		strContent = "menu"+arrLinkId[i];
		if ( arrLinkId[i] == eltId )
		{
			document.getElementById(arrLinkId[i]).className = arrClassLink[0];
			document.getElementById(strContent).className = "on content";
		}
		else
		{
			document.getElementById(arrLinkId[i]).className = arrClassLink[1];
			document.getElementById(strContent).className = "off content";
		}
	}	
}
</script>
<div id="menumodule">
  <ul id="menumanager">
    <li><a id="_0" class="current" onclick="multiClass(this.id)" href="#" >R1</a></li>
    <li><a id="_1" class="ghost" onclick="multiClass(this.id)" href="#" >R2</a></li>
    <li><a id="_2" class="ghost" onclick="multiClass(this.id)" href="#" >R3</a></li>
  </ul>
  <div id="menu_0" class="on content">
    <form method="post">
      <fieldset>
        <div>
          <input name="WPsubmitRefresh" value="R1" class="button" type="submit">
        </div>
      </fieldset>
    </form>
  </div>
  <div id="menu_1" class="off content">
    <form method="post">
      <fieldset>
        <div>
          <input name="OPsubmitRefresh" value="R2" class="button" type="submit">
        </div>
      </fieldset>
    </form>
  </div>
  <div id="menu_2" class="off content">
    <form method="post">
      <fieldset>
        <div>
          <input name="submitRefresh" value="R3" class="button" type="submit">
        </div>
      </fieldset>
    </form>
  </div>
</div>
</body>
</html> | 
Partager