Javascript-форум (https://javascript.ru/forum/)
-   Events/DOM/Window (https://javascript.ru/forum/events/)
-   -   Цвет текста и opacity (https://javascript.ru/forum/events/3798-cvet-teksta-i-opacity.html)

cronopio 24.05.2009 22:11
Цвет текста и opacity
 
Здравствуйте! Есть такой код
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<script type="text/javascript">
function setColor()
{
    document.getElementById("p1").style.color="#ff0000";
    setTimeout(function(){document.getElementById("p1").style.cssText='opacity:50'},500);
}
</script>
</head>
<body>

<p id="p1">This is an example paragraph</p>

<input type="button" onclick="setColor()"
value="Change color of text" />

</body>
</html>


За гранью моего понимания — почему как только меняю прозрачность, цвет текста вновь становится по умолчанию, или цвета прописанного в цсс — что я упустила? Помогите советом плиз:help:

Octane 24.05.2009 22:54
Потому что ты весь cssText перезписываешь.
document.getElementById("p1").style.opacity = "0.5"

CSS-свойство opacity может иметь значения от 0.0 до 1.0.
А для IE прозрачность устанавливается фильтром:
document.getElementById("p1").style.filter = "alpha(opacity=50)"

Тут уже значения от 0 до 100.

cronopio 24.05.2009 23:19
Век живи- век учись ) Пасиб - работает! Чтоб не делить на браузеры скрипт вот так сделала
document.getElementById("p1").style.cssText += 'opacity:50'; //плюс вариант для ИЕ и пр.
А про IE - знаю - для кратости убрала из кода.

x-yuri 25.05.2009 01:16 
document.getElementById("p1").style.cssText += 'opacity:50'; //плюс вариант для ИЕ и пр.

это непонятно для кого вариант

я бы скорее сделал так:
setTimeout(function(){
    document.getElementById("p1").style.opacity = "0.5";
    document.getElementById("p1").style.filter = "alpha(opacity=50)";
}, 500);

cssText редко используется

cronopio 25.05.2009 12:28
opacity:0.5 канешн - опечаталась. для ИЕ 
document.getElementById('p1').style.filter = 'alpha(opacity=50)';

вроде все правильно, только не хочет он это кушать :-/ (ИЕ6 у меня)

Octane 25.05.2009 14:09
Чтобы фильтры заработали в IE для этого же элемента нужно включить hasLayout. Самый простой способ - установить ширину или высоту элемента. Если так нельзя сделать, то добавьте CSS-свойство zoom:1; только проверьте все ли хорошо в Safari, последние версии стали поддерживать это свойство.

cronopio 25.05.2009 20:45
Вот уж поистине коварство ослика не имеет границ - я б долго мучилась. Спасибо - все работает теперь. :victory:


Часовой пояс GMT +3, время: 08:58.