как ПРАВИЛЬНО крутить куб
Всем привет, вот, видел где-то как крутится кубик, и решил изобрести велосипед.
Главная цель - понять как это всё должно работать правильно. Пока-что есть вот что и то, на jsfiddle почему-то отказалось работать :( Сейчас он просто переворачивается, но есть ряд проблем 1. Перевёрнутые грани, оно вроде так и должно быть, но не юзабильно если применять 2. После некоторых манипуляций, поворачивает не туда, куда хотелось-бы, оси что-ли поворачиваются тоже? О_О 3. отдаление при перевороте. но думаю это реально сделать, если добавить анимацию в каком-нить классе, и просто добавлять класс. 4. запрет следующего вращении, пока не закончено это, я пытался сделать |
Цитата:
No wrap - in <body> потому что у вас onclick="rotY(-90)" а не $(...).click |
Поправил
Вот а теперь. жду идей, советов) |
Цитата:
var nowY = 0; var nowZ = 0; var off = true; function rotX(angle){ if(off){ var $elem = $(".cube"); off = false; $({deg: nowX}).animate({deg: nowX+angle}, { duration: 2000, step: function(now) { $elem.css({ transform: 'rotateX(' + now + 'deg) '+'rotateY('+nowY+'deg) '+'rotateZ('+nowZ+'deg)' }); } },100 сюда надо ставить off=true; ); off=true; а не тут nowX = nowX + angle; } } |
xTODx,
смотря какой синтаксис вы используите callback — функция, которая будет вызвана после завершения анимации или complete — функция, которая будет вызвана после завершения анимации цифра 100 бесполезная величина в коде , но jQuery этим не испугать. |
Да, я уже сам к этом упришёл, исправил.
НО оно всё-равно работает, в функцию его: |
После одного поворота - не крутит
|
Цитата:
Цитата:
http://api.jquery.com/animate/#anima...erties-options :-/ или Цитата:
Цитата:
function rotX(angle){
if(off){
var $elem = $(".cube");
off = false;
$({deg: nowX}).animate({deg: nowX+angle}, {
duration: 2000,
step: function(now) {
$elem.css({
transform: 'rotateX(' + now + 'deg) '+'rotateY('+nowY+'deg) '+'rotateZ('+nowZ+'deg)'
});
},
*!*
complete : function(){off=true;}
*/!*
});
nowX = nowX + angle;
}
}
|
Действительно работает
|
из идей, по поводу того, чтобы текст был всегда правильно повёрнутым, есть идея - поворачивать его тогда, когда уже повернул кубик. Т.е. на соседних гранях он уже будет правильным.
Ноо.. нужно тогда сделать как-то отслеживание положения куба. |
| Часовой пояс GMT +3, время: 12:40. |