Чи можлива анімація у jpg, або як організувати найпростіше слайд-шоу

Як Ви все вже напевно переконалися, величезне значення для будь-якого сайту має його графічне оформлення. Для домашньої сторінки (особливо це стосується дівчат) одним з кращих варіантів наповнення може служити фотогалерея. Способів організації онлайнових фотоальбомів існує незліченна безліч, про багатьох з них ми вже неодноразово розповідали в попередніх номерах нашого журналу. Сьогодні ми пропонуємо Вашій увазі один з рідкісних способів створення такої галереї.

Безперервний показ слайдів.

Працюючу версію Ви зможете побачити тут.

Ідея дуже проста. Ми створюємо архів pictures з декількох картинок. Елементами цього архіву pictures [i] є імена відповідних графічних файлів. За допомогою функції scroll_image () ми маємо можливість оновлювати (з певною періодичністю, в нашому випадку це півтори секунди) нашу галерею. Якщо прибрати сторчку n = 0, то у нас не буде зациклення показу картинок, тобто галерея буде показана тільки один раз. А що буде, якщо зменшити час переходу до наступній картинці від півтора секунд до кількох десятих часток?

Створення анімації без використання старого доброго ГИФА.

У багатьох веб-дизайнерів дуже часто виникає питання, а що робити, якщо gif-зображення використовувати незручно, а анімацію створити необхідно. Як правило, такі незручності бувають пов'язані з тим, що gif дуже погано стискає фотографічні зображення. Напевно, Ви часто зустрічаєте в Інтернеті анімовані gif-банери низької якості в палітрі 32, а то і 16 кольорів, в яких робиться спроба передати фотозображення. Весь час хочеться сказати творцям таких банерів, що краще б вони використовували jpg-компресію, навіть пожертвувавши анімацією. Нерідко буває, що jpg набагато кращої якості займає місця на диску в кілька разів менше. Але, на жаль, у jpg є один величезний недолік: його не можна зробити анімованим. На щастя, за допомогою Java Script, зокрема саме того скрипта, який Ви бачите кількома рядками вище, можна легко вирішити цю проблему. Для цього треба всього лише на всього зменшити час поновлення галереї до декількох десятків мілісекунд. Ви побачите послідовність з jpg-ів, оновлюються зі швидкістю анімованого gif-а. Так що тепер, використовуючи цей скрипт, Ви можете робити у себе на сайті невеликі фотографічні мультики.

Працюючий варіант Ви можете подивитися тут.




Працюючу версію Ви зможете побачити тут.

Для запам'ятовування номера ілюстрації, яка показувалася в той момент, коли була натиснута кнопка "Пауза", була введена змінна rec. Важливо звернути увагу на те, що цього разу функція scroll_image використовується з параметром. Як нього передається номер картинки в послідовності. Коли цей параметр має значення "-1", функція припиняє своє виконання, т. Е. Показ слайдів на цьому завершується. Зміни в написанні функції scroll_image Ви можете побачити, зберігши сторінку з працюючим варіантом.

Створення підписів до картинок.

comm = new Array ()
for (i = 0; i<3;i++)
comm [i] = new Image ();
if (i == 0) comm [i] = "картинка 1";
if (i == 1) comm [i] = "картинка 2";
if (i == 2) comm [i] = "картинка 3";
>

Оновлювати значення цього поля ми будемо за допомогою тієї ж самої функції scroll_image. Для цього в неї необхідно додати рядок:

Працюючу версію Ви зможете побачити тут.

Такий спосіб створення галерей зустрічається в Інтернеті дуже не часто, а вже використання Java Script для реалізації анімованої послідовності jpg-в - це взагалі велика рідкість. Перший спосіб розумно використовувати хоча б в силу тієї причини, що він не вимагає переходу на нову сторінку, що істотно збільшує швидкість роботи сайту. Другий дозволяє существено збільшити якість зображень при розмірі файлів, еквівалентному анімованими gif-у більш низької якості.