====== 差别 ======
这里会显示出您选择的修订版和当前版本之间的差别。
两侧同时换到之前的修订记录 前一修订版 后一修订版 | 前一修订版 上一修订版 两侧同时换到之后的修订记录 | ||
css3d_旋转木马 [2021/12/21 16:01] 若愚 |
css3d_旋转木马 [2021/12/21 16:03] 若愚 |
||
---|---|---|---|
行 1: | 行 1: | ||
+ | # CSS 3D 转换 | ||
## 旋转木马 | ## 旋转木马 | ||
+ | |||
+ | ###### 目录 | ||
+ | - [介绍](CSS3D/ | ||
+ | - [透视](CSS3D/ | ||
+ | - [3D transform 函数](CSS3D/ | ||
+ | - [卡片翻转](CSS3D/ | ||
+ | - [立方体](CSS3D/ | ||
+ | - [盒子](CSS3D/ | ||
+ | - [旋转木马](CSS3D/ | ||
+ | - [总结](CSS3D/ | ||
+ | - [返回列表](document/ | ||
+ | |||
+ | |||
在内容轮播方面,前端开发人员有无数的选择。[我可以推荐 Flickity 吗?](https:// | 在内容轮播方面,前端开发人员有无数的选择。[我可以推荐 Flickity 吗?](https:// | ||
行 187: | 行 201: | ||
</ | </ | ||
+ | < | ||
var carousel = document.querySelector(' | var carousel = document.querySelector(' | ||
var cellCount = 9; | var cellCount = 9; | ||
行 209: | 行 223: | ||
}); | }); | ||
+ | </ | ||
``` | ``` | ||
行 336: | 行 351: | ||
</ | </ | ||
+ | < | ||
var carousel = document.querySelector(' | var carousel = document.querySelector(' | ||
var cells = carousel.querySelectorAll(' | var cells = carousel.querySelectorAll(' | ||
行 411: | 行 426: | ||
// set initials | // set initials | ||
onOrientationChange(); | onOrientationChange(); | ||
+ | </ | ||
``` | ``` | ||
我们不仅可以改变单元格的数量,我们甚至可以将旋转木马的方向从水平改为垂直。 | 我们不仅可以改变单元格的数量,我们甚至可以将旋转木马的方向从水平改为垂直。 |