小编Gig*_*San的帖子

HTML5旋转动画——如何显示“硬币的另一面”?

考虑这个 JSFiddle 旋转示例

HTML:

<div class="container">
  <div class="coin">
    <div class="face heads">
      Hey!
    </div>
    <div class="face tails">
      Ho!
    </div>
  </div>
</div>
Run Code Online (Sandbox Code Playgroud)

CSS:

@keyframes rotation {
  0% {
    transform: rotate3d(0, 1, 0, 0deg);
  }
  50% {
    transform: rotate3d(0, 1, 0, 180deg);
  }
  100% {
    transform: rotate3d(0, 1, 0, 360deg);
  }
}

.container {
  background-color: blue;
  width: 100px;
  height: 100px;
}

.coin {
  position: relative;
  top: 25px;
  left: 25px;
  width: 50px;
  height: 50px;
  text-align: center;
  line-height: 50px;
  animation-name: rotation;
  animation-iteration-count: infinite;
  animation-timing-function: …
Run Code Online (Sandbox Code Playgroud)

html css animation css-animations

2
推荐指数
1
解决办法
6066
查看次数

未捕获的TypeError:.unshift不是函数

我有一段相当琐碎的代码让我陷入困境.

使用下面的代码我试图在数组的开头添加一个值,即当前第一个值减去100.

var slideHeights = null;
// ... other stuff, nothing is done to slideHeights
function updateHeights() {
    slideHeights = $('*[data-anchor]').map(function(i, item) {
        return Math.floor($(item).offset().top);
    }); // [2026, 2975, 3924, 4873, 5822, 6771, 7720, 8669, 9618]
    slideHeights.unshift(slideHeights[0] - 100);
    slideHeights.push(slideHeights[9] + 100);
}
Run Code Online (Sandbox Code Playgroud)

而且我收到了错误

未捕获的TypeError:slideHeights.unshift不是一个函数

如果我评论.unshift和纠正.push所有工作中的索引正常,并正确添加第9个元素.

我甚至尝试分离价值,但没有运气:

var x = slideHeights[0] - 100;
slideHeights.unshift(x);
Run Code Online (Sandbox Code Playgroud)

我真的很难过,这一定是我看不到的一个微不足道的问题.

有任何想法吗?提前感谢您的回复.祝你今天愉快!:)

javascript arrays jquery

2
推荐指数
1
解决办法
4181
查看次数

标签 统计

animation ×1

arrays ×1

css ×1

css-animations ×1

html ×1

javascript ×1

jquery ×1