js 代码测试 - js 在线编辑器

<!DOCTYPE html>
<html>
<head>
<style> 
div {
  width: 100px;
  height: 100px;
  background: red;
  color: white;
  -webkit-animation: mymove 2s infinite linear alternate; /* Chrome, Safari, Opera */
  animation: mymove 2s infinite linear alternate;
}

/* Chrome, Safari, Opera */
@-webkit-keyframes mymove {
  to {-webkit-transform: rotateY(180deg);}
}

@keyframes mymove {
  to {transform: rotateY(180deg);}
}
</style>
</head>
<body>

<p>选中/取消选中复选框以更改动画 DIV 元素的背面可见性：</p>
<div id="myDIV">
  <h1>Hello</h1>
</div>

<input type="checkbox" onclick="myFunction(this)" checked>backface-visibility

<p><strong>注意：</strong> Internet Explorer 9 及更早版本不支持 backface-visibility 和 backfaceVisibility 属性。</p>

</body>
</html>

​x
 
<!DOCTYPE html><html><head><style> div {  width: 100px;  height: 100px;  background: red;  color: white;  -webkit-animation: mymove 2s infinite linear alternate; /* Chrome, Safari, Opera */  animation: mymove 2s infinite linear alternate;}​/* Chrome, Safari, Opera */@-webkit-keyframes mymove {  to {-webkit-transform: rotateY(180deg);}}​@keyframes mymove {  to {transform: rotateY(180deg);}}</style></head><body>​<p>选中/取消选中复选框以更改动画 DIV 元素的背面可见性：</p><div id="myDIV">  <h1>Hello</h1></div>​<input type="checkbox" onclick="myFunction(this)" checked>backface-visibility​<script>function myFunction(x) {  if (x.checked === true) {    document.getElementById("myDIV").style.WebkitBackfaceVisibility = "visible"; // Code for Chrome, Safari, Opera    document.getElementById("myDIV").style.backfaceVisibility = "visible";  } else {    document.getElementById("myDIV").style.WebkitBackfaceVisibility = "hidden"; // Code for Chrome, Safari, Opera    document.getElementById("myDIV").style.backfaceVisibility = "hidden";  }}</script>​<p><strong>注意：</strong> Internet Explorer 9 及更早版本不支持 backface-visibility 和 backfaceVisibility 属性。</p>​</body></html>​​

报个问题: