使用JS和CSS临时翻转网站上下颠倒

6qftjkof  于 2023-02-06  发布在  其他
关注(0)|答案(2)|浏览(111)

作为一个12月28日的笑话,我想暂时翻转我的网页颠倒与此代码:

body {
transform:rotate(180deg);
-ms-transform:rotate(180deg);
-webkit-transform:rotate(180deg);
}

我想把这段代码用javascript写下来

window.setTimeout(function(){ },3000);

我如何修改css代码?

yvt65v4c

yvt65v4c1#

您可以使用一个类,将该类添加到正文中以执行转换,然后在

body.transform {
  transform:rotate(180deg);
  -ms-transform:rotate(180deg);
  -webkit-transform:rotate(180deg);
}
document.body.className = 'transform';
setTimeout(function(){ document.body.className = ''; },3000);
68bkxrlz

68bkxrlz2#

function flip() {    
Array.prototype.slice.call(  document.querySelectorAll(    'div,p,span,img,a,body')).map(function(tag){tag.style['transform'] = 'rotate(' + 180 +'deg)';});
}
function unflip() {    
Array.prototype.slice.call(  document.querySelectorAll(    'div,p,span,img,a,body')).map(function(tag){tag.style['transform'] = 'rotate(' + 0 +'deg)';});
}

是一种翻转屏幕上所有内容的方法,然后简单地

flip()

然后打开

unflip()

相关问题