Warning: Cannot use a scalar value as an array in /home/admin/public_html/forum/include/fm.class.php on line 757

Warning: Invalid argument supplied for foreach() in /home/admin/public_html/forum/include/fm.class.php on line 770

Warning: Invalid argument supplied for foreach() in /home/admin/public_html/forum/topic.php on line 737
Форумы портала PHP.SU :: Время gif анимации [2]

 PHP.SU

 Программирование на PHP, MySQL и другие веб-технологии
PHP.SU Портал     На главную страницу форума Главная     Помощь Помощь     Поиск Поиск     Поиск Яндекс Поиск Яндекс     Вакансии  Пользователи Пользователи


 Страниц (7): « 1 [2] 3 4 5 6 7 »   

> Без описания
Поиск в теме | Версия для печати
Bio man
Отправлено: 04 Июля, 2012 - 15:57:36
Post Id


Постоянный участник


Покинул форум
Сообщений всего: 2751
Дата рег-ции: Июль 2010  
Откуда: Даугавпилс, Латвия


Помог: 52 раз(а)
А проиграть по клику есть?
 
 Top
DeepVarvar Супермодератор
Отправлено: 04 Июля, 2012 - 16:04:32
Post Id



Активный участник


Покинул форум
Сообщений всего: 10377
Дата рег-ции: Дек. 2008  
Откуда: Альфа Центавра


Помог: 353 раз(а)
Я не помню - виндовоза в глаза не видел уже года два..
 
 Top
IllusionMH
Отправлено: 04 Июля, 2012 - 16:12:26
Post Id



Активный участник


Покинул форум
Сообщений всего: 4254
Дата рег-ции: Февр. 2011  
Откуда: .kh.ua


Помог: 242 раз(а)
Bio man, как крайний вариант, можно на сервере(или где-еще) делать превьюхи, а потом при наведении подменять src, (предварительно подгрузив в фоне) и тогда начнется проигрывание

upd. Возможно превьюху первого кадра можно будет сделать через canvas (вечером попытаюсь глянуть), но это не поможет со старыми браузерами.

(Отредактировано автором: 04 Июля, 2012 - 16:15:15)

 
 Top
Zuldek
Отправлено: 04 Июля, 2012 - 16:15:22
Post Id


Постоянный участник


Покинул форум
Сообщений всего: 2122
Дата рег-ции: Июнь 2010  


Помог: 50 раз(а)
DeepVarvar пишет:
проиграть по наведению.
Все это вшивается в гифку и вуаля - никакого js не нужно.

Это делается средствами JS. на выходе imageReady выдает html c готовым js-кодом и включаемым gif-файлом.
(Замечу, что это не означает, что нельзя включить работающий Js-код в файл изображения Подмигивание )
Проигрывание 1 раз или более, - это да, указывается в самом файле средствами формата.

(Отредактировано автором: 04 Июля, 2012 - 16:31:26)

 
 Top
Bio man
Отправлено: 04 Июля, 2012 - 16:22:21
Post Id


Постоянный участник


Покинул форум
Сообщений всего: 2751
Дата рег-ции: Июль 2010  
Откуда: Даугавпилс, Латвия


Помог: 52 раз(а)
в фотошопе есть имадж реди?
 
 Top
Zuldek
Отправлено: 04 Июля, 2012 - 16:27:44
Post Id


Постоянный участник


Покинул форум
Сообщений всего: 2122
Дата рег-ции: Июнь 2010  


Помог: 50 раз(а)
Bio man пишет:
в фотошопе есть имейдж реди?
смотря в какой версии в CS 2 он отдельно, а в CS5 вроде уже весь функционал в один фотошоп встроен.
 
 Top
Bio man
Отправлено: 04 Июля, 2012 - 19:13:51
Post Id


Постоянный участник


Покинул форум
Сообщений всего: 2751
Дата рег-ции: Июль 2010  
Откуда: Даугавпилс, Латвия


Помог: 52 раз(а)
Страница загружается, все гифки подгружаются, анимация не циклическая. Нажимаю и появляется уже отработанная гифка! как сделать, что бы при нажатии гифка опять проигрывалась?
 
 Top
DeepVarvar Супермодератор
Отправлено: 04 Июля, 2012 - 20:07:34
Post Id



Активный участник


Покинул форум
Сообщений всего: 10377
Дата рег-ции: Дек. 2008  
Откуда: Альфа Центавра


Помог: 353 раз(а)
А в ImageReady (или где там теперь) все правильно сделано? Может там гдето какую хитрую галочку надо проставить или еще что?
 
 Top
Bio man
Отправлено: 04 Июля, 2012 - 20:27:24
Post Id


Постоянный участник


Покинул форум
Сообщений всего: 2751
Дата рег-ции: Июль 2010  
Откуда: Даугавпилс, Латвия


Помог: 52 раз(а)
DeepVarvar
я не через ImageReady, просто нативный JS написаный на коленке для теста. Установлю прогу посмотрю, но может все таки как то руками можно сделать?
 
 Top
DlTA
Отправлено: 04 Июля, 2012 - 20:36:50
Post Id



Постоянный участник


Покинул форум
Сообщений всего: 2952
Дата рег-ции: Окт. 2010  


Помог: 53 раз(а)
таки через задницу идет решение

как было упомянуто выше, готовится превьюха можно даже jpg и анимированная гифка в которой задано количество повторений 1
и при наведении/клике средствами js/css производить подмену
проблема может возникнуть в обратной подмене, для подготовки ко второму клику,
но если все гифки стандартизировать, так чтоб знать их длительность (хотяб максимальную) то в принцыпе проблем больше быть не должно

лучше конечно подмену производить средствами JS, чтоб потом делать обратное преобразование.
 
 Top
Bio man
Отправлено: 04 Июля, 2012 - 22:17:49
Post Id


Постоянный участник


Покинул форум
Сообщений всего: 2751
Дата рег-ции: Июль 2010  
Откуда: Даугавпилс, Латвия


Помог: 52 раз(а)
DlTA пишет:
таки через задницу идет решение
а с превьюхами значит не через задницу, да?
Нужно загрузить ВСЕ гифки (в скрытых полях), что бы не было задержки от загрузки картинок. Затем при каждом наведении/клике отображать и проигрывать определенную гифку. Хрен с ним со временем, где то 1 сек будет.
Может все таки есть решение?
 
 Top
armancho7777777 Супермодератор
Отправлено: 05 Июля, 2012 - 03:14:30
Post Id



Активный участник


Покинул форум
Сообщений всего: 4526
Дата рег-ции: Февр. 2011  
Откуда: Москва


Помог: 221 раз(а)
Bio man, а если анимацию реализовать путём использования спрайта из кадров гифки,
контейнера из div-а с фиксированной шириной по размеру одного кадра
и функции setInterval(), меняя background-position контейнера покадрово.
А останавливать анимацию с помощью clearInterval().

На пример:

CODE (javascript):
скопировать код в буфер обмена
  1.  
  2. var setAnimate, flag = 0;
  3.  
  4. function my_animat()
  5. {
  6.       var animate_conteiner = $('#animate-conteiner'),
  7.           t = 0, // Позиция фона по вертикали
  8.           H = 128, // Высота кадра и самого контейнера
  9.           sprH = 3840, // Высота спрайта
  10.           speed = 25; // Скорость анимации (40 кадров в секунду)
  11.  
  12.           if(flag == 0)
  13.           {
  14.                   flag = 1;
  15.                  
  16.                   setAnimate = setInterval(function(){
  17.                            
  18.                          t += H;
  19.                          if(t == sprH) t = 0;
  20.                          animate_conteiner.css({'background-position':'0 -'+t+'px'});
  21.  
  22.                   }, speed);
  23.           }
  24. }  
  25.  
  26.  
  27. function stop_animat()
  28. {
  29.     if(flag == 1)
  30.     {
  31.         flag = 0;
  32.         clearInterval(setAnimate);
  33.     }
  34. }
  35.  
  36.  
  37. $(function(){
  38.  
  39.         my_animat();
  40.        
  41.        
  42.         // Запуск анимации
  43.         $('#btn-start').click(function(e) {
  44.                 my_animat();
  45.         });
  46.        
  47.        
  48.         // Остантовка анимации
  49.         $('#btn-stop').click(function(e) {
  50.                 stop_animat();
  51.         });
  52.  
  53. });
  54.  


CODE (css):
скопировать код в буфер обмена
  1.  
  2. #animate-conteiner {
  3.         width:128px;
  4.         height:128px;
  5.         background:url(sprite.gif) 0 0 no-repeat;
  6.         }
  7.  

(Отредактировано автором: 05 Июля, 2012 - 07:38:33)

 
 Top
armancho7777777 Супермодератор
Отправлено: 05 Июля, 2012 - 05:20:56
Post Id



Активный участник


Покинул форум
Сообщений всего: 4526
Дата рег-ции: Февр. 2011  
Откуда: Москва


Помог: 221 раз(а)
Живой пример

flag в функциях использовал для того,
чтобы анимация не перезапускалась каждый раз при клике на кнопку "start",
если она (анимация) уже анимируется.

P.S. Плюсы такой анимации:
ну, по крайней мере в том, что можно использовать полупрозрачные png Улыбка
Ну и анимация более подконтрольна из скрипта.

(Отредактировано автором: 05 Июля, 2012 - 05:36:28)

 
 Top
DeepVarvar Супермодератор
Отправлено: 05 Июля, 2012 - 06:28:59
Post Id



Активный участник


Покинул форум
Сообщений всего: 10377
Дата рег-ции: Дек. 2008  
Откуда: Альфа Центавра


Помог: 353 раз(а)
armancho7777777, отличная идея. А я и забыл что у меня была когда-то wave-картинка от звуковой дорожки и я её горизонтальное смещение анимировал почти таким способом создавая loop.
 
 Top
armancho7777777 Супермодератор
Отправлено: 05 Июля, 2012 - 07:01:25
Post Id



Активный участник


Покинул форум
Сообщений всего: 4526
Дата рег-ции: Февр. 2011  
Откуда: Москва


Помог: 221 раз(а)
DeepVarvar пишет:
armancho7777777, отличная идея

Спасибо DeepVarvar Улыбка

(Отредактировано автором: 05 Июля, 2012 - 07:01:59)

 
 Top
Поиск в теме | Версия для печати
Страниц (7): « 1 [2] 3 4 5 6 7 »
Сейчас эту тему просматривают: 0 (гостей: 0, зарегистрированных: 0)
« JavaScript & VBScript »


Все гости форума могут просматривать этот раздел.
Только зарегистрированные пользователи могут создавать новые темы в этом разделе.
Только зарегистрированные пользователи могут отвечать на сообщения в этом разделе.
  



Powered by PHP  Powered By MySQL  Powered by Nginx  Valid CSS  RSS

 
Powered by ExBB FM 1.0 RC1. InvisionExBB