Комментарии 26
Параллакс действительно плавный, спасибо!
Хорошо бы добавить gh-pages и переименовать
sample.html в index.html, чтобы можно было посмотреть demo по адресу htdt.github.io/parallax.НЛО прилетело и опубликовало эту надпись здесь
а клонами называются все сайты с горизонтальным параллаксом?
ну и сами пройдитесь по клонам, у Вас на странице не все сайты доступны.
ну и сами пройдитесь по клонам, у Вас на странице не все сайты доступны.
А почему бы не сделать не просто смещения, а поворот вокруг оси Z (или всех трёх), вокруг какого-то (смыслового?) объекта? Было бы, как мне кажется, круто и довольно свежо. К сожалению, даже простенький пример сейчас не смог бы набросать, но мысль мою вы должны были уловить.
Те кто скопировал полностью вас- вообще жесть) Как людям не стыдно, на 100% копировать)
Я бы не стал заказывать работу у студии, которая копирует на 100%…
Я бы не стал заказывать работу у студии, которая копирует на 100%…
А на 98?)
Если копировать — то копировать с умом, при этом разбираясь в предмете. Разбираться — не значит знать как поменять фон и скорость скроллирования.
[upd]
Даже «клоны» можно делать со вкусом, при этом не до конца разбираясь в технологии.
Если копировать — то копировать с умом, при этом разбираясь в предмете. Разбираться — не значит знать как поменять фон и скорость скроллирования.
[upd]
Даже «клоны» можно делать со вкусом, при этом не до конца разбираясь в технологии.
> Я бы не стал заказывать работу у студии, которая копирует на 100%…
Думаю, что многие не стали бы. Только откуда заказчик узнает, что дизайн украден?
Кстати, я давно заметил, что на сайтах типа TemplateMonster довольно популярны шаблоны студий веб дизайна.
Думаю, что многие не стали бы. Только откуда заказчик узнает, что дизайн украден?
Кстати, я давно заметил, что на сайтах типа TemplateMonster довольно популярны шаблоны студий веб дизайна.
Не знаю почему, но зайдя на ваш впомнил о кедах redkeds.com
Такие же ссылки меню, такие же квадраты в портфолио, но все более продуманно и красиво.
Такие же ссылки меню, такие же квадраты в портфолио, но все более продуманно и красиво.
А как вы пришли к тому, что описания работ в Портфолио (пример) представлены просто картинкой JPEG. Оценивали плюсы и минусы, может просто есть причина в лоб, которая толкнула на это?
У вас действительно классный сайт! Переключение языков доставляет:)
Однако есть один небольшой косяк: на форме «ЗАЯВКА НА СОЗДАНИЕ САЙТА», если просто нажать кнопку «Отправить заявку», то выскочит несколько подряд валидационных alert'ов, что не есть хорошо.
Однако есть один небольшой косяк: на форме «ЗАЯВКА НА СОЗДАНИЕ САЙТА», если просто нажать кнопку «Отправить заявку», то выскочит несколько подряд валидационных alert'ов, что не есть хорошо.
спасибо! а учитывая эту публикацию, с валидацией совсем позор)
Если клонируют — значит упех!
К сожалению, такое решение подходит именно для клонов. С такой полнотой документации, технических примеров (не wow) и тестов далеко не уедешь. Например, нужно сделать не линейную анимацию (в начале едем вниз, потом вправо, потом вниз) и не понятно с какой стороны зайти к вашему решению. Я бы проще взял таймлайн с Greensock с декларативным паралаксом у Parallax.js или SuperScrolloram'у.
OpenSource — это не просто выкинуть читаемый код и пример внедрения — это большая работа (примеры, документация, работа с комунити). На данный момент, к сожалению, проект находится в стадии выкидыша OpenSource. Надеюсь у вас все получится и вы обеспечите достойную поддержку вашему проекту!
К сожалению, такое решение подходит именно для клонов. С такой полнотой документации, технических примеров (не wow) и тестов далеко не уедешь. Например, нужно сделать не линейную анимацию (в начале едем вниз, потом вправо, потом вниз) и не понятно с какой стороны зайти к вашему решению. Я бы проще взял таймлайн с Greensock с декларативным паралаксом у Parallax.js или SuperScrolloram'у.
OpenSource — это не просто выкинуть читаемый код и пример внедрения — это большая работа (примеры, документация, работа с комунити). На данный момент, к сожалению, проект находится в стадии выкидыша OpenSource. Надеюсь у вас все получится и вы обеспечите достойную поддержку вашему проекту!
Безотносительно классного параллакса, просто ради интереса: сколько кликов собирает элемент «свяжитесь с нами» по сравнению с «оставить заявку»? Я сам раз десять нажал, пока сообразил, что стрелка указывает на ссылку в подвале, а не является кнопкой или направлением дальнейшего скролла.
Только у меня безбожно тормозит все?
нет, вы не один. параллакс, наверное, крутой, но я с такого сайта сразу уйду
У меня очень плавно, но и компьютер довольно мощный.
Только на телефоне с андроидом — и тормозит, и скроллится рывками.
Странно, у меня HotDot работает хорошо, скролится и не тормозит, а вот клоны очень долго грузятся и старашно тормозят
под Оперой тормозит страшно.
вы молодцы, дизайнерам отдельный респект. движок и правда получается интересный, но у него еще есть потенциал для ускорения.
в анимационной верстке лучше использовать абсолютное позиционирование. float: left для контейнеров со слайдами это reflow на всю глубину при трансформациях. особенно при ресайзах сейчас это заметно.
чтобы исключить лишние перерисовки и вычисления скрывайте невидимые объекты и отключайте для них анимационную логику. сейчас все слайды пересчитываются постоянно. это серьезная заморочка, если ваша цель «сколь угодно страничный параллакс».
при работе с css из js старайтесь избегать чередования чтения и модификации css-свойств. особенно тех, которые связаны с геометрией и способны приводить к запуску reflow.
запись непосредственно в style.cssText при модификациях пачек свойств работает в разы быстрее, чем вызовы $.css().
планирование операций, связанных с рендером, лучше поручить requestAnimationFrame()
вообще, чаще используйте профайлер, он дает много информации к размышлению.
от кода, по мимо документации, хочется модульности какой-нибудь. осталось ощущение, что вся эта простыня собрана из отдельных, изначально, кусочков. какая-то особенность сборки примера для github?
в анимационной верстке лучше использовать абсолютное позиционирование. float: left для контейнеров со слайдами это reflow на всю глубину при трансформациях. особенно при ресайзах сейчас это заметно.
чтобы исключить лишние перерисовки и вычисления скрывайте невидимые объекты и отключайте для них анимационную логику. сейчас все слайды пересчитываются постоянно. это серьезная заморочка, если ваша цель «сколь угодно страничный параллакс».
при работе с css из js старайтесь избегать чередования чтения и модификации css-свойств. особенно тех, которые связаны с геометрией и способны приводить к запуску reflow.
запись непосредственно в style.cssText при модификациях пачек свойств работает в разы быстрее, чем вызовы $.css().
планирование операций, связанных с рендером, лучше поручить requestAnimationFrame()
вообще, чаще используйте профайлер, он дает много информации к размышлению.
от кода, по мимо документации, хочется модульности какой-нибудь. осталось ощущение, что вся эта простыня собрана из отдельных, изначально, кусочков. какая-то особенность сборки примера для github?
Скрипт отличный, но под IE хотя бы с 8ки и хотя бы в каком-то виде адаптировать можно было.
Большое спасибо всем за отзывы!
Мы очень спешили опубликовать движок и у нас не хватило ресурсов подготовить хорошую документацию.
Мы будем очень рады энтузиастам, которые помогут заполнить этот пробел.
Мы очень спешили опубликовать движок и у нас не хватило ресурсов подготовить хорошую документацию.
Мы будем очень рады энтузиастам, которые помогут заполнить этот пробел.
Зарегистрируйтесь на Хабре, чтобы оставить комментарий
Hot Dot Parallax Engine под лицензией MIT