Ustawienie kolejności warstw za pomocą z-index

<html>
<head>
<style>
.rel {
height: 20px;
position: relative;
background: #CCFFFF;
}
.dymek {
left:10px;
position:absolute;
background: #FFFFCC;
font: normal 12px Arial, Verdana, Tahoma, Helvetica, sans-serif;
padding: 5px;
border: #CCCCCC 1px solid;
width: 150px;
}
#rd1 {z-index:13;}
#rd2 {z-index:12;}
#rd3 {z-index:11;}
#rd4 {z-index:10;}
</style>
</head>
<body>
<div id="rd1" class="rel"><div id="d1" class="dymek">Polska, Warszawa, Lublin, Siedliszcze</div></div>
<div id="rd2" class="rel"><div id="d2" class="dymek">Polska, Warszawa, Lublin, Siedliszcze</div></div>
<div id="rd3" class="rel"><div id="d3" class="dymek">Polska, Warszawa, Lublin, Siedliszcze</div></div>
<div id="rd4" class="rel"><div id="d4" class="dymek">Polska, Warszawa, Lublin, Siedliszcze</div></div>
</body>
</html>

Prosty zestaw styli do formularzy

<style>
 body {background:white;line-height:17px;font-size:12px;font-family:tahoma, arial, helvetica, sans-serif;}
 form  { padding: 0px; margin: 0px; display: inline; }
 input { cursor: hand; }
 .lista td { border-bottom: 1px solid #EDEDED; }
 .lista td { padding-left: 10px; padding-right: 10px; }
 .lista td .button { text-align: center; }
</style>

Zmiana rozmiaru mapy

map = new GMap2(document.getElementById(„mapcan”));
…..
map.getContainer().style.width = 500+’px’;
map.getContainer().style.height = 500+’px’;
map.checkResize();

Kod należy umieścić w funkcji JS.
Wywołanie funkcji powoduje zmiane rozmiaru mapy.

przycisk submit w jednej linii z polem input

.submit { vertical-align: middle; *vertical-align: text-bottom; }

<input type=”text” name=”cos”><input type=”image” name=”search” src=”images/szukaj.gif” class=”submit”>

Aby ustawić obok siebie pole input i przycisk submit należy zstosować powyższy kod.

Pokazywanie i ukrywanie elementu

  if(tow_nr==6) {
   var felem = document.getElementById(‚fadd’);
   felem.style.visibility = ‚hidden’;
   return;
  }

  if(tow_nr==1) {
   var felem = document.getElementById(‚fdel’);
   felem.style.visibility = ‚visible’;
  }

Zwiększenie wysokości pola textarea

function tekstsize(h) {
 var elem = document.getElementById(„main_text”);
 elem.style.height = h+’px’;
}

<input type=”button” name=”wybor” value=” – ” onClick=”tekstsize(150)”> &nbsp;
<input type=”button” name=”wybor” value=” + ” onClick=”tekstsize(1000)”>

<textarea name=”main_text” id=”main_text” cols=’90’ rows=’10’ wrap=’virtual’>