Comments 55
UFO just landed and posted this here
так напомнило сайты 1996 го года с зачатками JS и поддержкой прозрачных GIF
+7
Может быть, вы еще и в Деда Мороза не верите? :)
Это просто интересный пример, а не призыв украшать сайты елочками и падающими снежинками ;) Что касается древности, то лично у меня такое ощущение, что в ближайшие год-два html5 c canvas, svg и javascript предстоит быстрыми темпами пройти путь от таких простых поделок до чего-то более мощного (см. например, предыдущий пост).
Поэтому мы еще неоднократно увидим примеры с генерацией графики в различных вариациях. Лет 5-7 назад было много примеров по генерации плазмы, огня и прочих эффектов на flash, а еще сильно раньше различные такие эффекты писали на native code (c/c++) и работали с видео-карточками через прерывания. «HTML5» предстоит быстро пройти аналогичный путь.
Это просто интересный пример, а не призыв украшать сайты елочками и падающими снежинками ;) Что касается древности, то лично у меня такое ощущение, что в ближайшие год-два html5 c canvas, svg и javascript предстоит быстрыми темпами пройти путь от таких простых поделок до чего-то более мощного (см. например, предыдущий пост).
Поэтому мы еще неоднократно увидим примеры с генерацией графики в различных вариациях. Лет 5-7 назад было много примеров по генерации плазмы, огня и прочих эффектов на flash, а еще сильно раньше различные такие эффекты писали на native code (c/c++) и работали с видео-карточками через прерывания. «HTML5» предстоит быстро пройти аналогичный путь.
+13
А вот, кстати, те эффекты, про которые вы говорите.
Нужен webGL (у меня работает с Chome) + аппаратная графика.
Кстати, подобные эффекты в HTML5 пока тормозят из-за очень долгой работы canvas.putImageData в некоторых браузерах.
Нужен webGL (у меня работает с Chome) + аппаратная графика.
Кстати, подобные эффекты в HTML5 пока тормозят из-за очень долгой работы canvas.putImageData в некоторых браузерах.
0
вы что?! даже у гугла снежинки — bit.ly/eZ2KEQ
+8
Это программистский прикол, не всем понятно.
+5
Имхо в createSnowflake надо вместо
var y = window.pageYOffset;
написать
var y = window.pageYOffset — rand(window.innerHeight);
А то сразу после старта они как-то неравномерно падают…
var y = window.pageYOffset;
написать
var y = window.pageYOffset — rand(window.innerHeight);
А то сразу после старта они как-то неравномерно падают…
0
Пожалуйста, ненадо.
0
Снежинки — не сильно эффектный пример…
0
[offtop]Вкладки IE ужасны.[/offtop]
0
а это так задумано?
![](http://s1.ipicture.ru/uploads/20101218/8q5hnMmL.png)
![](http://s1.ipicture.ru/uploads/20101218/8q5hnMmL.png)
0
снежинки кстати и под эту картинку залетают и под форму ввода
0
Да, я в коде прописал canvas.style.zIndex = '-10'; соответственно canvas располагается внизу, иначе он будет перекрывать все другие элементы (и события на них).
0
Неужели с этим нельзя ничего сделать? :)
0
В данной реализации это аналогично тому, что вы бы поверх всей страницы разместили обычную картинку или flash.
0
Обидно.
Эффект красивые, не вижу причин для всеобщего возмущения, который наблюдается :)
Есть досадный баг с определением загрузки в первом вложенном условии, по крайней мере в FF и Crome, при загрузке скрипта через
Попробую пофиксить :)
Эффект красивые, не вижу причин для всеобщего возмущения, который наблюдается :)
Есть досадный баг с определением загрузки в первом вложенном условии, по крайней мере в FF и Crome, при загрузке скрипта через
<script type="text/javascript" async="true" src="http://static.example.com/js/fractal_snow.js"></script>
Попробую пофиксить :)
0
Итак, в случае использования загрузки скриптов с помощью async=«true» приходится использовать событие «load», так как DOMContentLoaded уже успевает пройти.
В начало функции snow() добавляем:
А условие в начале скрипта заменяем на
В начало функции snow() добавляем:
window.removeEventListener('DOMContentLoaded', snow, false);
window.removeEventListener('load', snow, false);
А условие в начале скрипта заменяем на
if (document.createElement('canvas').getContext) {
if (document.readyState === 'complete') {
snow();
} else {
window.addEventListener('DOMContentLoaded', snow, false);
window.addEventListener('load', snow, false);
}
} else {
return;
}
+2
почему бы не запускать много маленьких канвасиков?
0
Да, z-index: -10;
0
Это такой завуалированный подарок энергетикам на новый год?
+5
Раньше дети в садах снежинки из салфеток вырезали и наклеивали иногда на окна…
Прошло немного лет.
Теперь они выросли, и стали делать снежинки из кода… в блоге конторы, которая делает ОС «окна»
Прошло немного лет.
Теперь они выросли, и стали делать снежинки из кода… в блоге конторы, которая делает ОС «окна»
+2
Chromium 10.0.613.0 (69331) на Ubuntu 10.10 падает при попытке выполнить код.
+1
Подозреваю, что это баг. Браузер не должен падать при выполнении js-кода, в крайнем случае должна выдаваться ошибка кода, либо если проблема с производительностью, браузер должен предлагать остановить код/убить вкладку.
+2
Chrome 8.0.552.224 beta на openSUSE 11.3 летит нормально :)
0
С наступающими!
+2
я так понимаю начинается предновогодняя тематика…
Авторы — пишите! Чем больше напишете — тем больше шанс что это сможет повторить большее количество пытающихся))
фрактальная снежинка — рулез ( хотя я бы предпочел скрещивающиеся мечи или морской штурвал )
Народ — не скупитесь на творчество и проявите проф снисходительность — праздник же!
Авторы — пишите! Чем больше напишете — тем больше шанс что это сможет повторить большее количество пытающихся))
фрактальная снежинка — рулез ( хотя я бы предпочел скрещивающиеся мечи или морской штурвал )
Народ — не скупитесь на творчество и проявите проф снисходительность — праздник же!
+3
Если долго смотреть на снежинки их становится все меньше. Походу тут нет проверки за выход их вправо-влево, и со временем они все уходят и не возвращаются.
Если после этого обновить размеры экрана — они все снова вываливаются как тут и были.
Предлагаю добавить как-то так:
Если после этого обновить размеры экрана — они все снова вываливаются как тут и были.
Предлагаю добавить как-то так:
if (flake.x > canvas.width+flake.size || flake.x < -flake.size) {
flake.y = 0;
flake.x = rand(canvas.width);
}
0
UFO just landed and posted this here
А у yahoo.com до сих пор снежинки на логотипе флешем отрисовываются)
+2
UFO just landed and posted this here
Со времен плавающих рыбок, мой кот не занимал компьютера на такое долгое время.
+2
Хех, как запустить в Chrome, что разобраться не могу…
0
Нененененененененененененененененененеееееееет!!! Не надо! Убейте их!!! Сукка… Лихие 90-ые возвращаются!
-1
а мне например интересен чисто код,
для повышения скилла
да и фракталы люблю, как идею сделать красивой зависит уже от вас самих.
для повышения скилла
да и фракталы люблю, как идею сделать красивой зависит уже от вас самих.
0
Sign up to leave a comment.
Запускаем фрактальные снежинки на HTML5 Canvas