Hey, I wanted to create a spiral effect with my divs which contain links and photos. The spiral should look like this:
from now on, I just have this, i am really new and hope you guys can help mehttps://jsfiddle.net/hn1fc790/
hofk
January 30, 2021, 1:43pm
2
You can find a spiral there, but without CSS3D:picture coil
hofk
January 30, 2021, 1:50pm
3
For CSS3D see these examples from the
The answers to some questions contain some very interesting and instructive basic examples. These are difficult to find in the large number of questions on discourse.There are also good examples in resources and showcase.
Therefore I collected them and put them on one page, clearly arranged by time.
The collection may be a help for beginners. http://discourse.threejs.hofk.de/ is now redirected
to the safe side * discourse.threejs.hofk.de
UPDATE 202…
GradientsMaterialColor
MixedHtmlCssWebGl
see also How to set the options correctly in the select element? (CSS3DObject)
The official example css3d_periodictable has a similar transformation preset HELIX. I suggest you use the respective code as a basis for your own project:
// helix for ( let i = 0, l = objects.length; i < l; i ++ ) { const theta = i * 0.175 + Math.PI; const y = - ( i * 8 ) + 450; const object = new THREE.Object3D(); object.position.setFromCylindricalCoords( 900, theta, y ); vector.x = object.position.x * 2; vector.y = object.position.y; vector.z = object.position.z * 2; object.lookAt( vector ); targets.helix.push( object ); }
3 Likes
