Как создать скролл-ленту из фотографий?

Сегодняшний урок покажет вам как из любых изображений создать ленту, которая наподобие бегущей строки будет демонстрировать поочередно выбранные фото. Для того, чтобы вы поняли, о чем речь, привожу наглядный пример скролл-ленты из трех изображений.
Стоит вам поместить курсор перед первым снимком, как лента начнет двигаться, наведете курсор на любое изображение - лента останавливается.

Кстати, двигаться лента может и в правую сторону, и вверх, и вниз, все зависит от настроек, которые вы укажете. А теперь к делу...
Кому понравилась идея создания скролл-ленты и он хочет воплотить ее на своем сайте, прошу следовать дальнейшим инструкциям.

Шаг 1. Идем в меню "Вставка" и выбираем пункт "Встроенные java-скрипты".
Шаг 2. В появившемся окне выбора скриптов выбираем последнюю строку и щелкнув по ней, диалоговое окно примет вид, как на скриншоте.
Шаг 3. Теперь загрузим нужные изображения с помощью кнопки Добавить (она анологична Обзору). Как только вы добавите первое фото, тут же в нижнем поле начнется демонстрация эффекта скролл-ленты, картинка станет двигаться. А вы тем временем продолжайте добавлять изображения, вновь нажимая на Добавить.

Когда нужное их количество будет добавлено, останется выбрать направление движения ленты. Скриптом предусмотрено движение в четырех направлениях: влево, вправо, вверх и вниз. Вы можете здесь же опробовать все четыре направления, чтобы увидеть воочию действие скрипта.  В конце всех настроек не забудьте нажать "ОК".

Скролл-лента готова, только позвольте напомнить, в рабочем окне программе она не функционирует. Чтобы увидеть полученный результат, воспользуйтесь встроееным просмотром в браузере.

На этом урок окончен...
Всем успехов и до новых встреч! С ув. Светлана (SvetLana_TSV)
                                               Добро пожаловать в проект "Сайт с нуля" !
Прежде всего данный проект предназначен для тех, кто пытается создать сайт самостоятельно, то есть для новичков. Соответственно, вся информация изложена доступно, все этапы построения сайта сопровождаются скриншотами, что позволит начинающим вебмастерам быстро и просто освоиться в этом нелегком вопросе.
Здесь вы можете скачать русские версии WebPageMaker, WordPress, Joomla, Adobe Muse, а также инструкции по установке WordPress и Joomla на хостинг и мануалы по установке тем (шаблонов) для этих CMS.

                               Всем желаю удачи и смелых воплощений идей на вашем сайте !
Проект для новичков
Пошаговое руководство для новичков по созданию,
раскрутке и монетизации собственного сайта.
WebPageMaker, Wordpress, Joomla - инструкции для
новичков по установке CMS и шаблонов к ним.
2010 - 2016 © Сайт с нуля: пошаговое руководство для новичков по созданию, раскрутке и монетизации собственного сайта. WebPageMaker, WordPress, Joomla -  русские версии.
Автор и администратор  данного проекта - SvetLana_TSV.  Копирование материалов сайта разрешено только при наличии активной ссылки на данный проект.
Главная       Скачать       Уроки        Новости        Статьи        Контакты        Карта сайта
Хочешь быть на шаг впереди и первее
остальных получать новые материалы
сайта? Тогда не забудь оставить свои
координаты: имя и электронный адрес!
ПОДРОБНЕЕ

Не забудь заглянуть в свою почту и подтвердить подписку!