園子裡看到很不錯的3d展示，需要在 chrome 或 edge 下正常工作 。
效果圖:
源**:
<html
>
<
head
>
head
>
<
body
>
<
div
class
="newsitem"
>
<
div
id="blog-news"
>
<
div
style
="display: none"
id="__document_write_ajax_div-1"
>
div><
script
charset
="shift_jis"
>
window[
'__document_write_ajax_callbacks__'][
'1']();
script
>
<
style
type
="text/css"
>
.snow-container
style
>
<
div
class
="snow-container"
>
div>
<
style
>
/*最外層容器樣式
*/.wrap
/*包裹所有容器樣式
*/.cube
@-webkit-keyframes rotate
to }
.cube div
/*定義所有樣式
*/.pic
.cube .out_front
.cube .out_back
.cube .out_left
.cube .out_right
.cube .out_top
.cube .out_bottom
/*定義小正方體樣式
*/.cube span
.cube .in_pic
.cube .in_front
.cube .in_back
.cube .in_left
.cube .in_right
.cube .in_top
.cube .in_bottom
/*滑鼠移入後樣式
*/.cube:hover .out_front
.cube:hover .out_back
.cube:hover .out_left
.cube:hover .out_right
.cube:hover .out_top
.cube:hover .out_bottom
style
>
<
div
class
="wrap"
>
<
div
class
="cube"
>
<
div
class
="out_front"
>
<
img
src=""
class
="pic"
>
div>
<
div
class
="out_back"
>
<
img
src=""
class
="pic"
>
div>
<
div
class
="out_left"
>
<
img
src=""
class
="pic"
>
div>
<
div
class
="out_right"
>
<
img
src=""
class
="pic"
>
div>
<
div
class
="out_top"
>
<
img
src=""
class
="pic"
>
div>
<
div
class
="out_bottom"
>
<
img
src=""
class
="pic"
>
div>
<
span
class
="in_front"
>
<
img
src=""
class
="in_pic"
>
span
>
<
span
class
="in_back"
>
<
img
src=""
class
="in_pic"
>
span
>
<
span
class
="in_left"
>
<
img
src=""
class
="in_pic"
>
span
>
<
span
class
="in_right"
>
<
img
src=""
class
="in_pic"
>
span
>
<
span
class
="in_top"
>
<
img
src=""
class
="in_pic"
>
span
>
<
span
class
="in_bottom"
>
<
img
src=""
class
="in_pic"
>
span
>
div>
div>
div>
div>
body
>
html
>
實現立方體旋轉
html部分 12 3456 css 1.3維空間圖 電腦螢幕中心為原點，橫向為x軸，縱向為y軸，人臉的方向為z軸 translate x,y translatex x translatey y translatez z translate3d x,y,z 定義位置的移動距離 rotate angl...
3D 旋轉立方體
source cube src.js var cube function this.5 function d,e,a if e if a this.1 this.1 function p j,g,b,o this.7 function this.3 function this.4 function ...
OpenGL旋轉立方體的實現
計算機圖形學大作業 使用opengl實現旋轉的正方體。主要分為搭建環境和完成 編寫兩部分。安裝完成後，我們可以建立opengl的demo過程如下 檔案 新建 專案 opengl 直接編譯執行demo，將會展示乙個旋轉的三角形如下圖所示 另外如需使用其他opengl庫，需要自行配置 將相關.dll檔案...