我正在尝试动态创建div外部图像,然后执行旋转。我已经编写了代码,但是图像翻转完成但是我无法看到3D旋转。
$(obj).css("-webkit-transform","rotateY(180deg)");
$(obj).css("transform","rotateY(180deg)");
var imgLeftPos = $(obj).position().left;
var imgTopPos = $(obj).position().top;
$(obj).wrap('<div class="f1_card"></div>');
$(obj).wrap('<div class="front face"></div>');
$(".f1_card").wrap('<div class="f1_container"></div>');
var div = $("<div class='back face'></div>");
$('.face').after(div);
$('.back').css("left",imgLeftPos+"px");
$('.back').css("top",imgTopPos+"px");
var arrId = parseInt(obj.id.substr(2));
console.log("arrId = "+arrId)
window.setTimeout(function () {
$(".back").html(imgArr[arrId]);
},900);
对于第二次点击,我已经编写了解开图像的代码,并且我可以通过3D旋转看到翻转。我的代码中存在问题吗?
答案 0 :(得分:0)
我认为你试图以错误的方式去做。
我会说你已经完成了所有的CSS并进行了测试,然后使用你的脚本来创建div并为它分配你在CSS中定义的类。