VPF::Динамическое изменение text-shadow

Blaga

Дата 13.3.2010, 06:56 (ссылка)

(нет голосов)

Загрузка ...

ЛамМер++

Профиль
Группа: Участник
Сообщений: 429
Регистрация: 15.11.2005
Где: г. Иркутск

Репутация: нет
Всего: 4

Всем доброго времени суток.
Вопрос такой. Как вы знаете новые браузеры стали поддерживать некоторые вещи из CSS3 и хотелось бы не отставать.
Как его применить я решил. Но мне нужен такой скрипт который бы по таймеру рандомом выдавал бы это свойство к тексту.
Но сколько я не мучался, ничего толкового не получается. Изменение размеров текста получается, а вот изменить это свойство - нет.
Вот скрипт, может кто подскажет как его поправить и что в нем не работает.

Код

<!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">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251" />
<title>asdzxc</title>
<script type="text/javascript">
// использование Math.round() даст неравномерное распределение!
function getRand(min, max)
{
  return Math.floor(Math.random() * (max - min + 1)) + min;
}

function animate(element) {
setInterval(function Font()
{
    
    var el = document.getElementById(element);
    el.style.text-shadow = getRand('10','20')+"px "+getRand('10','20')+"px "+getRand('10','20')+"px #00ff00;";
}, 300);
}
</script>
</script>
</head>
<body>
<a href="javascript:void(0);" onclick="animate('content');">START</a>
<br /><br /><br />

<div  style="font-size:24px;text-shadow: 1px 1px 1px #000000;">
<a href="#" id="content">Super text</a>
</div> 
</body>
</html>

Всем заранее спасибо, плюсомет заряжен. smile

--------------------

http://displayart.ru - Обои.
http://a2themes.ru - Сайт о движках DLE, phpBB3, WordPress.

SelenIT

Дата 13.3.2010, 15:47 (ссылка)

(голосов:1)

Загрузка ...

баг форума

Профиль
Группа: Завсегдатай
Сообщений: 3996
Регистрация: 17.10.2006
Где: Pale Blue Dot

Репутация: 7
Всего: 401

el.style.textShadow?

p.s. симпатичный пример анимации text-shadow: http://www.zachstronaut.com/lab/text-shado...shadow-box.html

--------------------

Осторожно! Данный юзер и его посты содержат ДГМО! Противопоказано лицам с предрасположенностью к зонеризму!

Blaga

Дата 13.3.2010, 21:57 (ссылка)

(нет голосов)

Загрузка ...

ЛамМер++

Профиль
Группа: Участник
Сообщений: 429
Регистрация: 15.11.2005
Где: г. Иркутск

Репутация: нет
Всего: 4

не помогло. может быть я что то с интервалом накосячил? Просто я плохо понимаю в ява скрипте.. :(

--------------------

http://displayart.ru - Обои.
http://a2themes.ru - Сайт о движках DLE, phpBB3, WordPress.

SelenIT

Дата 13.3.2010, 23:37 (ссылка)

(нет голосов)

Загрузка ...

баг форума

Профиль
Группа: Завсегдатай
Сообщений: 3996
Регистрация: 17.10.2006
Где: Pale Blue Dot

Репутация: 7
Всего: 401

Код


    el.style.textShadow = getRand(10,20)+"px "+getRand(10,20)+"px "+getRand(10,20)+"px #00ff00";

- в конце значения точки с запятой не надо (это разделитель свойств CSS, а не часть значения свойства);
- в getRand передаются числа, а не строки (иначе некорректно работает плюс и получаются дикие цифры).

А с интервалом всё нормально вроде (по крайней мере, у меня работает).

Это сообщение отредактировал(а) SelenIT - 13.3.2010, 23:38

--------------------

Осторожно! Данный юзер и его посты содержат ДГМО! Противопоказано лицам с предрасположенностью к зонеризму!

Blaga

Дата 14.3.2010, 07:30 (ссылка)

(нет голосов)

Загрузка ...

ЛамМер++

Профиль
Группа: Участник
Сообщений: 429
Регистрация: 15.11.2005
Где: г. Иркутск

Репутация: нет
Всего: 4

Спасибо! Действительно помогло. Только вот косяк в Опере, работает как то очень скрытно...
То есть когда смотришь на этот текст он ничего не выполняет, все статично.
Но если отмотать скролл вниз так что бы текст скрылся а потом вернуться то будет видно что скрипт замер в последнем состоянии и опять стоит. Короче говоря скрипт в опере работает только тогда когда его никто не видит... :(
В чем может быть проблема? Может быть для оперы какие то костыли нужны специальные?
Заранее спасибо!

--------------------

http://displayart.ru - Обои.
http://a2themes.ru - Сайт о движках DLE, phpBB3, WordPress.

0 Пользователей читают эту тему (0 Гостей и 0 Скрытых Пользователей)
0 Пользователей:
« Предыдущая тема \| JavaScript: для новичков \| Следующая тема »