Модераторы: Sardar, Aliance
  

Поиск:

Ответ в темуСоздание новой темы Создание опроса
> Анимация вращения барабана лотереи 
:(
    Опции темы
everyone
  Дата 14.1.2014, 19:05 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Бывалый
*


Профиль
Группа: Участник
Сообщений: 218
Регистрация: 24.3.2004

Репутация: нет
Всего: 4



Есть игровой барабан (см. прикреплённое изображение).

При нажатии на кнопку барабан крутится слева направо.

Получается циклическая карусель в правую сторону (на эту тему я нашёл - http://www.sencha.com/blog/infinite-ajax-carousel/).
Ещё интересен эффект быстрого вращения(может быть какое-нибудь смазывание) барабана и постепенной его остановки.

Интересуют идеи - кто как бы это реализовал. Желательно без нагромождения дополнительных библиотек, разве что jQuery.

Присоединённый файл ( Кол-во скачиваний: 11 )
Присоединённый файл  Untitled.png 3,64 Kb
--------------------
Что написал, то написал (Пилат)
PM ICQ Skype   Вверх
ksnk
Дата 14.1.2014, 19:44 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


прохожий
****


Профиль
Группа: Комодератор
Сообщений: 6855
Регистрация: 13.4.2007
Где: СПб

Репутация: 84
Всего: 386



Я как то тут уже постил. 
Вот, оно на jsfiddle


--------------------
Человеку свойственно ошибаться, программисту свойственно ошибаться профессионально ! user posted image
PM MAIL WWW Skype   Вверх
everyone
Дата 14.1.2014, 19:50 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Бывалый
*


Профиль
Группа: Участник
Сообщений: 218
Регистрация: 24.3.2004

Репутация: нет
Всего: 4



ksnk, Похоже на то, что нужно. Спасибо
--------------------
Что написал, то написал (Пилат)
PM ICQ Skype   Вверх
ksnk
Дата 15.1.2014, 16:39 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


прохожий
****


Профиль
Группа: Комодератор
Сообщений: 6855
Регистрация: 13.4.2007
Где: СПб

Репутация: 84
Всего: 386



Более похожая на игровой автомат реализация. 
Останавливается ровно на цифрах, хотя без магии (начальное смещение в 26 px) не обошлось. Либо я где-то стормозил в формулах, либо просто где то туплю, либо погрешность вещественных вычислений накапливается.



--------------------
Человеку свойственно ошибаться, программисту свойственно ошибаться профессионально ! user posted image
PM MAIL WWW Skype   Вверх
everyone
Дата 15.1.2014, 20:04 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Бывалый
*


Профиль
Группа: Участник
Сообщений: 218
Регистрация: 24.3.2004

Репутация: нет
Всего: 4



Если ячейки три(больше одной), как в моём примере, то этот способ не совсем подходит, немного тормознуто выглядит когда цифры заканчиваются, и всё сбрасывается на единицу. Приходится вручную подбирать скорость, чтобы не сильно бросалось в глаза то, что это не настоящее вращение а просто перетаскивание слева направо. Ещё попробую наложить размытие во время движения.
Кроме того, горизонтальный пример будет немного отличаться.
Будет время, оформлю и выложу, что ориентировочно получилось )

Тем не менее проблема ещё интересна, тема открыта.
--------------------
Что написал, то написал (Пилат)
PM ICQ Skype   Вверх
ksnk
Дата 15.1.2014, 21:26 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


прохожий
****


Профиль
Группа: Комодератор
Сообщений: 6855
Регистрация: 13.4.2007
Где: СПб

Репутация: 84
Всего: 386



У меня тонкость в том, что за последним элементом стоит еще одна "первая" картинка. Это не забыто? Таким образом, обходимся без лишних дерганий.


--------------------
Человеку свойственно ошибаться, программисту свойственно ошибаться профессионально ! user posted image
PM MAIL WWW Skype   Вверх
everyone
Дата 17.1.2014, 19:25 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Бывалый
*


Профиль
Группа: Участник
Сообщений: 218
Регистрация: 24.3.2004

Репутация: нет
Всего: 4



Да, долго смеялся этому решению  smile 
Теперь копирую из начала в конец три элемента при загрузке скрипта.
--------------------
Что написал, то написал (Пилат)
PM ICQ Skype   Вверх
  
Ответ в темуСоздание новой темы Создание опроса
Форум для вопросов, которые имеются в справочниках, но их поиск вызвал затруднения, или для разработчика требуется совет или просьба отыскать ошибку. Напоминаем: 1) чётко формулируйте вопрос, 2) приведите пример того, что уже сделано, 3) укажите явно, нужен работающий пример или подсказка о том, где найти информацию.
 
0 Пользователей читают эту тему (0 Гостей и 0 Скрытых Пользователей)
0 Пользователей:
« Предыдущая тема | JavaScript: Общие вопросы | Следующая тема »


 




[ Время генерации скрипта: 0.1749 ]   [ Использовано запросов: 22 ]   [ GZIP включён ]


Реклама на сайте     Информационное спонсорство

 
По вопросам размещения рекламы пишите на vladimir(sobaka)vingrad.ru
Отказ от ответственности     Powered by Invision Power Board(R) 1.3 © 2003  IPS, Inc.