На сайте есть есть круг в центре экрана, как его заставить крутиться вокруг своей оси на планшете?

Question

[Павел Усов]

На сайте есть есть круг в центре экрана, как его заставить крутиться вокруг своей оси на планшете, когда по нему проводят пальцем в одну сторону и в другую?

Какие события jQuery применять для этого?

Comments

[Павел Усов]

крутиться нужно заставить пальцем)

Answer 1

[Сергей Мельников]

jsfiddle.net/3z3Za

Answer 2

[Илья Лесных]

css3 transition + transform: rotate(d). Но не понятно, при чем здесь планшет. Или имеется ввиду использовать данные положения устройства? Тогда нужно событие orientationchange и свойство window.orientation

Comments

[Павел Усов]

простите не уточнил. Я имел ввиду пальцем, если по нему жикаем)

[Илья Лесных]

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

Answer 3

[Анна Бакурова]

.load {
-webkit-animation: rot 1s linear infinite;
-moz-animation: rot 1s linear infinite;
-ms-animation: rot 1s linear infinite;
-o-animation: rot 1s linear infinite;
animation: rot 1s linear infinite;
}
@-webkit-keyframes rot {
0% { -webkit-transform: rotate(0deg); }
100% { -webkit-transform: rotate(359deg); }
}
@-moz-keyframes rot {
0% { -moz-transform: rotate(0deg); }
100% { -moz-transform: rotate(359deg); }
}
@-ms-keyframes rot {
0% { -ms-transform: rotate(0deg); }
100% { -ms-transform: rotate(359deg); }
}
@-o-keyframes rot {
0% { -o-transform: rotate(0deg); }
100% { -o-transform: rotate(359deg); }
}
@keyframes rot {
0% { transform: rotate(0deg); }
100% { transform: rotate(359deg); }
}

Answer 4

[animhotep]

для поворота блока достаточно css3