HTML5 3D相册 精美 女朋友礼物

【文件属性】：
文件名称：HTML5 3D相册 精美 女朋友礼物
文件大小：879KB
文件格式：RAR
更新时间：2017-05-19 03:50:15
HTML5 3D相册 女朋友 礼物 程序员给女朋友做的3D精美相册，让你震撼！ #icon { background: rgb(255, 144, 0); border-radius: 6px 0px 0px; transition:0.6s ease-in-out; left: 65px; top: 6px; width: 40px; height: 40px; overflow: hidden; position: relative; cursor: pointer; -moz-transition: all 0.6s ease-in-out 0s; -webkit-transition: all 0.6s ease-in-out 0s; -o-transition: all 0.6s ease-in-out 0s; } #icon div { background: none; position: absolute; } #icon div:nth-child(1) { border-width: 7px 0px 7px 8px; border-style: solid; border-color: transparent rgb(255, 255, 255); left: 20px; top: 50%; width: 0px; height: 0px; margin-top: -7px; position: absolute; } #icon div:nth-child(2) { background: rgb(255, 255, 255); left: 12px; top: 50%; width: 8px; height: 6px; margin-top: -3px; position: absolute; } #nav { top: 10px; width: 100px; height: 0px; position: absolute; -ms-user-select: none; -webkit-user-select: none; -moz-user-select: none; } #nav-switch { display: none; } #nav .label { display: block; cursor: pointer; } #nav .container { transition:left 0.3s ease-in-out; left: -100px; width: 100%; position: absolute; -moz-transition: left 0.3s ease-in-out 0s; -webkit-transition: left 0.3s ease-in-out 0s; -o-transition: left 0.3s ease-in-out 0s; } #nav .container > div { padding: 0px; width: 50%; float: left; } #nav .container .nav-on { color: rgb(51, 51, 51); padding-left: 0px; } #nav .container .nav-off { width: 40px; height: 40px; padding-right: 10px; } :checked#nav-switch + .label .container { left: 10px; } :checked#nav-switch + .label #icon { background: rgb(0, 101, 203); border-radius: 0px 0px 6px; transform: rotate(-180deg); -webkit-transform: rotate(-180deg); -moz-transform: rotate(-180deg); -o-transform: rotate(-180deg); } .title { margin: 0px; padding: 0px; left: 170px; top: 2px; height: 40px; color: rgb(51, 51, 51); line-height: 40px; font-family: "Segoe UI Light", "Segoe UI", Frutiger, "Frutiger Linotype", "Dejavu Sans", "Helvetica Neue", Arial, sans-serif; font-size: 24px; font-weight: bold; white-space: nowrap; position: absolute; -ms-user-select: none; -webkit-user-select: none; -moz-user-select: none; -o-user-select: none; user-select: none; } .menu { margin: 0px; padding: 0px; left: 0px; top: 6px; color: rgb(51, 51, 51); font-family: "Segoe UI Light", "Segoe UI", Frutiger, "Frutiger Linotype", "Dejavu Sans", "Helvetica Neue", Arial, sans-serif; font-size: 1em; font-weight: lighter; list-style-type: none; position: relative; cursor: pointer; } .menu li { list-style: none; width: 100px; height: 40px; border-right-color: rgb(221, 221, 221); border-right-width: 1px; border-right-style: solid; position: relative; cursor: pointer; } .menu a { color: rgb(51, 51, 51); line-height: 40px; padding-left: 40px; text-decoration: none; display: block; position: relative; } .menu li a:hover { background: rgb(255, 144, 0); } .menu li a:focus { background: rgb(255, 144, 0); } .menu li a:active { background: rgb(255, 144, 0); } #nav li::before { top: 50%; margin-left: 10px; position: absolute; content: ""; } #nav li::after { top: 50%; margin-left: 10px; position: absolute; content: ""; } #nav li a::before { top: 50%; margin-left: 10px; position: absolute; content: ""; } #nav li a::after { top: 50%; margin-left: 10px; position: absolute; content: ""; } #nav .home a::before { border-width: 8px 7px; border-style: solid; border-color: transparent transparent rgb(51, 51, 51); left: 2px; margin-top: -16px; } #nav .home a::after { border-width: 3px 4px 0px; border-style: solid; border-color: rgb(51, 51, 51) rgb(51, 51, 51) transparent; left: 4px; width: 2px; height: 4px; margin-top: 0px; } #nav .arrow a::before { border-width: 7px 0px 7px 8px; border-style: solid; border-color: transparent rgb(51, 51, 51); left: 8px; margin-top: -7px; } #nav .arrow a::after { background: rgb(51, 51, 51); left: 0px; width: 8px; height: 6px; margin-top: -3px; } #nav .back.arrow a::before { border-width: 7px 8px 7px 0px; left: 0px; } #nav .back.arrow a::after { left: 8px; }

【文件预览】：
imgs
----2.jpg(69KB)
----11.jpg(75KB)
----8.jpg(63KB)
----6.jpg(73KB)
----1.jpg(60KB)
----12.jpg(62KB)
----4.jpg(76KB)
----5.jpg(84KB)
----9.jpg(51KB)
----10.jpg(71KB)
----7.jpg(96KB)
----3.jpg(57KB)
res
----imageTransform3D.js(10KB)
----slider-wb.css(4KB)
----ge1doot.js(8KB)
----jquery-1.7.2.min.js(93KB)
3d-album.htm
more information.htm