Анимация средствами HTML+CSS+JS — промо-сайт японского Nissan Note

[iklementiev]

Весьма забавная реализация.
Мне кажется, это больше для вау эффекта. Посмотрел пару раз, порадовался и забил.

[Praeses]

Вот здесь еще нечто подобное thedeepestsite.com/

[Olegacy]

красиво, но быстро устаешь :(
в консоли:
var ts = setInterval(function(){ $('body').trigger('mousewheel', -100); }, 100); // применить чит clearInterval(ts) //остановить чит

[inkvizitor68sl]

Вполне шустро отработал, кстати.

[Scrup]

http://a-class.mercedes-benz.com/ru/ru/

[pluser]

Эхх круто!
И как же утомили авто-сайты которые мало того что без флеш не работают,
так ещё и ключевые данные оттуда достать уже подвиг.
Хотя 90% их потребностей покрывает js.

[lordofwinds]

Класс! Верчу туда-сюда… ей, как остановиться?!

[Niksg]

Братья Люмьер со своим паровозом отдыхают… Видимо разработчики этого сайта в детстве рисовали мультики в блокнотах и тетрадках

[red_andr]

Забавно, но палец сильно устал. Пойду отдыхать.

[zein]

а про возможность кликнуть на колесико забыли?

[Shaytank]

В меню есть кнопки «01», «02», «03», «04». С ними процесс немного упрощается :)

[VolCh]

Стареький ноут (Core DUo + 1 Gb) ссылка повечила намертво, вплоть до того, что выключать хардверное пришлось.

[BANTIK]

Ну это же сайт обновленного Ноута, так что старые ноуты не поддерживаются.

[macik_spb]

Не понимаю чего все в таком восторге.
У меня чувство, что я зря живу в 2012, а интернет достиг «такого» развития.

Спишем на своеобразное японское чувство прекрасного…

[amarao]

Почему у них такие безумно гигантские автомобили? Автомобиль размером в треть стадиона — это какой-то ужас.

(если кто не понял, я про масштаб машины на фоне окружающих зданий в движении).

[resurection]

dev.yourtwig.ru/ ещё один примерчик схожей анимации. Хоть и не такой длинный, но трафика много.

[YurkinPark]

креатив технолоджи прям :)

[michurin]

Не могу разделить общих восторгов. Хром 21.0.1180.89 не делает анимацию, а вываливает все картинки в длинющий документ. Может быть надо было долго жать, но это ниоткуда не следует, документы выглядит полностью загрузившимся. Я промотал его до конца и так и не дождался ничего нового. FF 15.0.1 грузит, грузит, грузит… вся система начинает тормозить… ничего потребного не получается. В век HTML5 и тега video! Для кого они это сделали?

[dshster]

Самое интересное — что в этом и фишка! Нет там как таковой анимации, а псевдо-анимационный эффект получается именно при прокрутке этой длинющей страницы. video в данном контексте было бы крайне примитивно.

[Homakov]

4 полосы, куча машин и разных картинок… хрень какая то неопрятная

[timonstr]

Нет такого свойства, как «display: hidden». Есть display: none.

[BANTIK]

Вы правы, спасибо! Думал про display, а написал про visibility.

[azproduction]

Вот как все было: «Одна японская студия сделала эту промо-страницу на Flash, но тут, внезапно, оказалось, что заказчик ожидал модных трендов читай HTML5. Так дедлайн был уже не за горамиФудзи, то под страхом сэппуку коменде пришлось применить Flash2HTML5+CSS+JS конвертацию.» Но тормозит так, что лучше уж сэппуку.

[Niksg]

На HTML5+CSS+JS можно сделать с помощью спрайтов, а не создавать длинную портянку в сотню экранов

[azproduction]

Это уже зависит от транслятора (если они все-таки использовали его) или рук проектировщика если делали с нуля. В потенциале этой связки HTML5+CSS+JS я не сомневаюсь.

[eme]

Никаких display:none там нету, простая портянка div'ов.
Эффект получился интересный.

[BANTIK]

Есть там display: none. Откройте FireBug и посмотрите как меняется свойство display у div'ов с классами «section show» при прокрутке.

[eme]

Да действительно в мозиле так.
Откройте в хроме и посмотрите насколько быстрее все работает и что там не меняются стили.
Вопрос. Зачем эти бесполезные телодвижения?