javascript - 用于图像或 DIV 翻转的纯 Javascript

标签 javascript html css flip

因为我需要在我的软件中编写 html,所以我只需要纯 javascript 来进行翻转。

请不要使用 css 动画或 Jquery 动画,只使用纯 javascript。

需要类似于:http://pingmin-tech.com/flipcardjs

在这里找到了一个解决方案: <强> DEMO

但如果我得到类似于 http://pingmin-tech.com/flipcardjs 会更好

最佳答案

javascript 在您的 html 代码之前。

这个链接是你在下面的评论中问我的答案: https://jsfiddle.net/ws7054r2/

#card {
  display: block;
  width: 50px;
  height: 50px;
  padding: 25px;
  background-color: black;
  color: white;
  font-family: 'Arial', sans-serif;
}
<script>
  var k = 0;

  function flip() {
    var j = document.getElementById("card");
    k += 180;
    j.style.transform = "rotatey(" + k + "deg)";
    j.style.transitionDuration = "0.5s"
  }
</script>
<div id="card" onmouseover="flip()">sample text</div>

关于javascript - 用于图像或 DIV 翻转的纯 Javascript,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/28492791/

相关文章:

javascript - 无法连接到我的 VPS 上的 node.js 服务器

ios - 从 HTML5 创建 native iOS/Android 应用程序

css - 如何在 ng-bootstrap 中更改模态框的位置

css - 如何使用chrome web Inspector查看hover代码

javascript - 如何在浏览器中显示尚未完全生成的视频文件?

javascript - 2xx 范围内的 jQuery ajax 自定义 HTTP 状态消息

javascript - 在 JavaScript 中将字符串拆分为单词、标点符号和空格的数组

html - 页面宽度超过浏览器窗口宽度。使用html和css

php - 在一个选项中选择两个值 html 表单 php mysql

HTML 按钮背景颜色属性不起作用