Flipclock🕓

一个类似FliqloScr的屏保页面；

来自我的掘金图床

点击任何位置都可全屏显示；

全屏即可使用，鼠标移动至左上角会滑出是否添加秒钟的滑块；

线上版链接 clock.xubh.top

缩放、页面旋转

 transform: scale(1, 1);
 transform: rotate(90deg);
 -ms-transform: rotate(90deg);
 /* Internet Explorer 9*/
 -moz-transform: rotate(90deg);
 /* Firefox */
 -webkit-transform: rotate(90deg);
  /* Safari 和 Chrome */
 -o-transform: rotate(90deg);
 /* Opera */

 transform: scale(1, 1);
 transform: rotate(90deg);
 -ms-transform: rotate(90deg);
 /* Internet Explorer 9*/
 -moz-transform: rotate(90deg);
 /* Firefox */
 -webkit-transform: rotate(90deg);
  /* Safari 和 Chrome */
 -o-transform: rotate(90deg);
 /* Opera */

因为自己有手机上使用的需要所以做了一些尺寸的适配

点击页面任何位置都全屏显示

        document.body.addEventListener('click', function () {
            // alert('click')
            if (!document.fullscreenElement &&
                !document.mozFullScreenElement && !document.webkitFullscreenElement && !document.msFullscreenElement) {  // current working methods
                if (document.documentElement.requestFullscreen) {
                    document.documentElement.requestFullscreen();
                } else if (document.documentElement.msRequestFullscreen) {
                    document.documentElement.msRequestFullscreen();
                } else if (document.documentElement.mozRequestFullScreen) {
                    document.documentElement.mozRequestFullScreen();
                } else if (document.documentElement.webkitRequestFullscreen) {
                    document.documentElement.webkitRequestFullscreen(Element.ALLOW_KEYBOARD_INPUT);
                }
            }
        })

        document.body.addEventListener('click', function () {
            // alert('click')
            if (!document.fullscreenElement &&
                !document.mozFullScreenElement && !document.webkitFullscreenElement && !document.msFullscreenElement) {  // current working methods
                if (document.documentElement.requestFullscreen) {
                    document.documentElement.requestFullscreen();
                } else if (document.documentElement.msRequestFullscreen) {
                    document.documentElement.msRequestFullscreen();
                } else if (document.documentElement.mozRequestFullScreen) {
                    document.documentElement.mozRequestFullScreen();
                } else if (document.documentElement.webkitRequestFullscreen) {
                    document.documentElement.webkitRequestFullscreen(Element.ALLOW_KEYBOARD_INPUT);
                }
            }
        })

代码已开源至 xubh/flipclock

参照使用了objectivehtml/FlipClock 开源的代码简化了部分操作；