БлогNot. Словомешалка

Словомешалка

Хотелось проверить, как работает в разных браузерах тег SVG и вся эта куча событий CSS, связанных с анимацией, которые можно попробовать установить все вместе с помощью JQuery .on(), ну и вообще посмотреть анимационный цикл на CSS.

Результаты не очень утешительные, а может, код кривоват. В "Лисе" не запускается, пока курсор не подведёшь к элементу, в Edge первый цикл комом пятном.

Тем не менее, оставлю это здесь. Скрипт выводит на меняющем цвет фоне случайное всплывающее слово по-русски из своего более чем 12-тысячного словаря самых распространённых русских слов (см. массив words в исходнике).

Увидеть исходник на HTML5 + CSS3 + Javascript можно, щёлкнув правой кнопкой мыши по приложенному HTML-файлу и выбрав пункт меню "Сохранить объект как...", "Сохранить ссылку как" и т.п., название пункта зависит от браузера. Скрипт использует библиотеку JQuery, подгружаемую с внешнего сайта.

 Файл freqWordAnimation.html в кодировке Юникода UTF-8 (295 Кб)

Я бы не стал лепить это на весь экран, а вызывал, например, из такого iframe (адрес фрейма уже адаптирован к адресу файла на моём сайте, код годится для непосредственной вставки):

наведите курсор, если анимация не началась...

<div style="width:640px; margin: auto;">
 <iframe src="http://blog.kislenko.net/archives/16851.html" width="600" height="200">
  Ваш браузер не поддерживает встроенные фреймы!
 </iframe>
 <p style="margin: 0; text-align: center; font-size: 0.8rem;">
  наведите курсор, если анимация не началась...
 </p>
</div>

 Более 12 тысяч распространённых русских слов массивом JS, только маленькие буквы, файл .txt в кодировке Юникода UTF-8 (268 Кб)

P.S. Термин "словомешалка" использовался в переводах опусов главкактусолога, но есть мнение, что Выготский и Гурджиев употребляли его куда раньше.

16.02.2023, 16:24 [313 просмотров]


теги: javascript css html браузеры random цвет графика jquery словарь

К этой статье пока нет комментариев, Ваш будет первым