Как делать сайты на одной странице с плавным листингом страниц?

Question

[emuravjev]

Друзья, привет!


Подскажите, где можно почитать статьи или туториалы как делать сайты типа такого fryreadsonegin.com или apple.com/mac-pro/. Мне интересно узнать, как верстается правое меню (из точек), а также работа со скритами для слайда страница.


Заранее спасибо за ссылки.

Answer 1

[SerDIDG]

Была статья — обзор паралакс скроллинга. habrahabr.ru/post/141687/

Answer 2

[Дмитрий]

Думаю, это то, что вам нужно:
Parallax scrolling (демо).

Answer 3

[Роман Мисюра]

Скорее всего вам надо использовать связку Паралакса и подобной фичи как в бутстрапе getbootstrap.com/javascript/#scrollspy-examples
github.com/sxalexander/jquery-scrollspy — сам плагин
davidwalsh.name/mootools-scrollspy — тут есть неплохие демо

Answer 4

[emuravjev]

Спасибо за ссылки, буду разбираться. Но во всех примерах — сайт длинный и скролл непрерывный. А в моем примере скролл как по слайдам, порциями.

Comments

[Роман Мисюра]

Если не ошибаюсь то в паралаксе часто используют position: fixed; а там уже скриптом подбирают что к чему.

Answer 5

[voidby]

есть такой туториал еще:
webdesign.tutsplus.com/tutorials/complete-websites/create-a-parallax-scrolling-website-using-stellar-js/

Answer 6

[Виктор]

Плавно скролит окно на 600 px от верха.

 	$("html,body").animate({ scrollTop: 600 }, "slow");

Если вы не хотите использовать Jquery то по таймеру изменяйте значение

      window.scrollTo(x,y)