Селекторы ID
Параметр ID задает уникальное имя элемента, которое используется
для обращения к нему скриптов. Это позволяет управлять стилем элемента
динамически.
Синтаксис ID селектора следующий.
#ID селектор { Параметр: Значение;
}
Пример 1. Использование идентификатора ID
<style>
#help { position:absolute; left:160px;
top:120px; width:225px; height:180px; z-index:1; }
</style>
<div ID=help>
<table width="100%" border="0" cellspacing="0"
cellpadding="4" height="100%">
<tr>
<td bgcolor="#FFFFCC">Этот элемент помогает в
случае, когда вы находитесь в осознании того факта, что совершенно
не понимаете, кто и как вам может помочь. Именно в этот момент
мы и подсказываем, что помочь вам никто не сможет.</td>
</tr>
</table>
</table>
</div>
В примере таблица помещена в слой с именем help.
Использование идентификатора дает возможность изменять некоторые
параметры таблицы, например, делать ее невидимой или видимой по
желанию (пример 2).
Пример 2. Изменение видимости слоя
<html>
<head>
<script language="JavaScript">
function init() {
IE = (document.all)
NC = (document.layers)
Opera = (document.getElementById)
}
function hiddenLayer() {
init();
if(IE) eval('document.all["descr"].style.visibility
= "hidden"')
if(NC) eval('document.layers["descr"].visibility
= "hidden"')
if(Opera) eval('document.getElementById("descr").style.visibility
= "hidden"')
}
function showLayer() {
init();
if(IE) eval('document.all["descr"].style.visibility
= "visible"')
if(NC) eval('document.layers["descr"].visibility
= "visible"')
if(Opera) eval('document.getElementById("descr").style.visibility
= "visible"')
}
</script>
</head>
<body>
<table width="90%" border="1"
cellspacing="0" cellpadding="4"
bordercolor="#666666" align="center">
<tr>
<td width="20%" align="center"><a
href=# onMouseOver="showLayer()" onMouseOut="hiddenLayer()"><img
src="button.gif" width="98" height="33"
border=0></a></td>
<td>
<div id="descr"
style="position: relative; visibility: hidden">Данная
эксклюзия является подмножеством астрациональных супремативных
монотенных федоний кадонарного экстрафазория.</div>
</td></tr></table>
</body>
</html>
|
H T M L