Слайд-шоу Apple.com/iphone: Как это работает? - PullRequest
Новая
       13

Слайд-шоу Apple.com/iphone: Как это работает?

1 голос
/ 06 октября 2011

так что это скорее вопрос любопытства, чем фактический вопрос, поэтому, пожалуйста, потерпите меня.Я только что проверил:

http://www.apple.com/iphone/

И слайд-шоу на обложке выглядит просто впечатляющим для меня.Я не хочу воспроизводить это, но мне просто искренне интересно, как это работает.Из моего осмотра они просто используют кучу синхронизированных переходов / преобразований webkit, но я не знаю точно, что происходит.

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

Ответы [ 3 ]

3 голосов
/ 20 февраля 2012

Вот объяснение: http://johnbhall.com/iphone-4s/

2 голосов
/ 12 октября 2011

Я просто отвечаю на свой вопрос, поскольку никто не мог предложить мне ответ, кроме жесткого кодирования.Я полагаю, Apple просто вкладывает в это много усилий.я все еще впечатлен изощренным использованием CSS-переходов, особенно когда объекты переходят в следующий кадр

0 голосов
/ 06 октября 2011

Вот рабочая демонстрация с исходным кодом.

В основном идея такова,

  • предварительно загрузить все изображения

  • есть таймер, который срабатывает каждые N секунд

  • когда срабатывает таймер, запустите анимацию преобразования, в которую будет вставлено новое изображение.

Разработки по идее позволяют вам останавливать / реверсировать / приостанавливать / возобновлять, автоматически останавливать после одного цикла и так далее.

Торговое название для этого эффекта - «слайдер». так что вы можете поискать слайдер в Google и найти множество обсуждений. Есть слайдеры для jquery (nivoslider), есть слайдеры для mootools (slideitmoo), есть опции без фреймворка (как, например, скрипт-демонстрация, на которую я ссылаюсь) и т. Д.

...