【ツール】3D直方体コード生成ツール - Little Strange Software

どうも！LSSです！！ 【CSS】preserve-3dを使って直方体を描いてみたら案の定大変だった話 で、とりあえず直方体をCSSで描いてみました。 要領はなんとか分かったものの、サイズ変更時のtranslateZの値の指定が少々面倒です^^; という事で、CSSが分からなくても、3Dの概念が分からなくても、画面上でスライダーをいじるだけで「直方体が描けるコード」を出力するツールをJavaScriptで作ってみました！ 3D直方体コード生成ツール 使い方 貼り付けた後のコードの修正について あとがき 3D直方体コード生成ツール コード 使い方 表示サンプル 直方体の傾きを示す「X:-20deg Y:-20deg Z:0deg」という表示 X軸回転、Y軸回転、Z軸回転に対応した３つのスライダー 直方体のサイズを示す「幅:200px 高さ:100px 厚さ:50px」という表示 幅、高さ、厚

[atarimaesore]

このページは　こども（孫か）との算数のイメージトレーニングに最適ですわ　面白いの作れるんですね

[newgenworld]

こりゃ面白い(≧∇≦)！何回もやっちゃった(´>∀<｀)ゝ真似したいリストに入っちゃいました✨

[Lunakko]

すごーい！これは楽しいですね(^_^)

[kefugahi]

適当にコロコロ転がしているだけでも結構楽しい。相変わらず何がどうしてこうなるかはサッパリですが凄いです！

[hukunekox]

遊んでしまいましたww😆画面関係なく大きくなったww

[tn198403s]

面白いです！透過で色の重なり具合が確認できるので、立体感が際立ちます。