I am trying to make 3D picture tables with three.js, and all is working fine, however, I would be able to have two pictures back-to-back with only 1 div :
in my element, I have a background, and I would have another picture on the other side.
Is it possible? With the property backface-visibility:hidden;
I can make the background disappear on the wrong side, but how do define a picture as "background of the backface" ?
.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";
Copyright Notice:Content Author:「Gullfaxi171」,Reproduced under the CC 4.0 BY-SA copyright license with a link to the original source and this disclaimer.
Link to original article:https://stackoverflow.com/questions/14008153/css-picture-instead-of-backface-visibility-hidden