0

我正在尝试用 three.js 制作 3D 图片表,一切正常,但是,我可以只用 1 个 div 背靠背地制作两张图片:

在我的元素中,我有一个背景,我会在另一侧有另一张照片。

可能吗?使用该属性backface-visibility:hidden;,我可以使背景消失在错误的一侧,但是如何将图片定义为“背面的背景”?

.element {
    width: 140px;
    height: 180px;
    box-shadow: 0px 0px 20px rgba(0,255,255,0.5);
    border: 1px solid rgba(127,255,255,0.25);
    cursor: default;
    backface-visibility:hidden;
    -webkit-backface-visibility:hidden;
    -moz-backface-visibility:hidden;
}

...

var element = document.createElement( 'div' );
element.className = 'element';
element.style.backgroundImage="url('img/img-"+(i+1)+".jpg')";
element.style.backgroundRepeat = "no-repeat";
element.style.backgroundPosition = "center";
4

2 回答 2

0

你不能,就其本身而言;backface-visibility: hidden;这样您就可以创建另一个元素,并在其后面添加包含您的背面的补充旋转。

于 2012-12-23T02:31:46.930 回答
0

您需要第二个元素作为背面。有关如何实现此功能的示例,请参见http://css3.bradshawenterprises.com/flip/ (并将示例 CSS3 动画视为奖励)。

于 2012-12-23T02:40:00.173 回答