Доступ к атрибутам стиля в IE и NN
Одна из основных проблем при создании страниц, предназначенных для просмотра
как Internet Explorer, таки Netscpe Navigator, это то, что доступ к атрибутам
стиля организован несколько по-разному.
Создадим элемент <DIV> с помощью следующего кода:
<DIV ID="myDiv" STYLE="position:absolute; left:50px; top:100px;
width:30px; height:30px; clip:rect(0px 30px 30px 0px);
background-color:red; layer-background-color:red;">
</DIV>
Необходимо помнить, что в Netscpe Navigator, для корректного отображения
пустого элемента следует указывать атрибуты layer-background-color
и clip. Кроме того элемент должен быть позиционирован заданием атрибута position:
absolute или position: relative
В этом случае для того, чтобы изменить цвет фона в NN следует использовать
следующий код:
document.myDiv.bgColor = "blue"
или
document.layers["myDiv"].bgColor = "blue"
Тогда как в IE необходимо поступить следующим образом:
myDiv.style.backgroundColor = "blue"
или
document.all["myDiv"].backgroundColor = "blue"
Таким образом мы видим, что отличаются не только наименования атрибутов, но
и способ их хранения. В общем случае (если наименования атрибутов совпадают) можно
воспользоваться следующим кодом, который создает переменную для доступа к свойствам
стиля:
if (NN) { var thisStyle = document.myDiv }
if (IE) { var thisStyle = myDiv.style }
Теперь для получения, например, горизонтальной координаты объекта можно использовать
следующий код:
alert(thisStyle.Left);
Для более сложных случаев (например с цветом фона) можно воспользоваться функциями
следующего вида:
function getBGColor ( o ) {
if (NN) { return(o.bgColor) }
if (IE) { return(o.style.backgroundColor) }
}
function setBGColor ( o, color ) {
if (NN) { o.bgColor = color }
if (IE) { o.style.backgroundColor = color }
}
Кроме того необходимо помнить, что свойство left в IE содержит значение с указанием единицы измерения
(в нашем случае это будет "50px"). Для получения этого (и других "координатных")
значений в пикселях необходимо использовать свойство pixelLeft
(pixelTop и т.д.)
Пример использования описанных методов: styleattr.html
Информация
взята с сайта "Опыты"