作者热门文章
- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
这是用于旋转 p
元素的函数:
<script>
function ani() {
var z = document.getElementById("rotate");
z.style.webkitTransition = "1.2s";
z.style.transition = "1.2s" ;
z.style.transform = "rotateY(360deg)";
z.style.webkitTransform = "rotateY(360deg)";
z.style.OTransform = "rotateY(360deg)";
z.style.MozTransform = "rotateY(360deg)";
}
</script>
这是完整的代码,包括 html 和 javascript:
<!DOCTYPE html>
<html lang="en-US">
<head>
<title>animation</title>
<meta chartset="utf-8">
<script>
function ani() {
var z = document.getElementById("rotate");
z.style.webkitTransition = "1.2s";
z.style.transition = "1.2s" ;
z.style.transform = "rotateY(360deg)";
z.style.webkitTransform = "rotateY(360deg)";
z.style.OTransform = "rotateY(360deg)";
z.style.MozTransform = "rotateY(360deg)";
}
</script>
</head>
<body>
<div>
<p onmouseover="ani()" id="rotate" style="background: rgba(0,0,0,0.5); text-align: center; color: #fff;">Great this is rotating!</p>
</div>
</body>
</html>
最佳答案
您应该学习制作 .css 文件并导入它们,而不是在 HTML 和 JavaScript 中设置所有内容的样式。这只是一个很好的做法。
HTML:
<!DOCTYPE html>
<html lang="en-US">
<head>
<title>animation</title>
<meta chartset="utf-8"/>
<link rel="stylesheet" href="style.css"/>
</head>
<body>
<p id="rotate">Great this is rotating!</p>
</body>
</html>
CSS(样式.css):
#rotate {
background: rgba(0,0,0,0.5);
text-align: center;
color: #fff;
}
#rotate:hover {
-webkit-transition: 1.2s all;
transition: 1.2s all;
-webkit-transform: rotateY(360deg);
-moz-transform: rotateY(360deg);
-o-transform: rotateY(360deg);
transform: rotateY(360deg);
}
JavaScript:
// Nothing! Fantastic!
关于javascript - javascript 函数只能运行一次,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/32322719/
有一条(相对)众所周知的 Perl 公理:“只有 Perl 可以解析 Perl”。我想知道 Perl 6 是否仍然如此? 扩大讨论...考虑到 PyPy 最近的更新,我想到了这个问题。 Perl 独特
这是设置。在上一个问题中,我发现我可以通过子组件中的状态传递对象属性,然后使用 componentDidUpdate 获取该对象属性。在这种情况下,状态和属性都称为到达。 这是基本代码... expo
我运行的是 10.5.2 社区版。我已经标记了 源/主要/资源 作为源目录。我可以右键单击并“编译”某些文件,据我所知,这意味着 IDE 将文件复制到与发送类文件的“com.mydomain.pack
我是一名优秀的程序员,十分优秀!