css+js实现太阳系行星轨道运行时钟指针效果代码-html代码-BFW代码库

css+js实现太阳系行星轨道运行时钟指针效果代码

代码语言：html

所属分类：其他

代码描述：css+js实现太阳系行星轨道运行时钟指针效果代码

下面为部分代码预览，完整代码请点击下载或在bfwstudio webide中打开

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">




    <style>
        body{
        	margin:0 auto;
        	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='100%25' width='100%25'%3E%3Cfilter id='filter-ynk201gnq'%3E%3CfeTurbulence baseFrequency='0.9' numOctaves='1' seed='1'%3E%3C/feTurbulence%3E%3CfeColorMatrix values='-0.3 3.3 2.4 2.1 -4.1 0 -2.6 2.4 3.7 -3.7 -1 -0.9 -4.9 0.7 -1.7 -2.2 2.7 -3.5 -1.8 4.5'%3E%3C/feColorMatrix%3E%3C/filter%3E%3C!-- %3Crect width='100%25' height='100%25' fill='rgb(43,173,230)' class='bgRect'%3E%3C/rect%3E --%3E%3Crect width='100%25' height='100%25' filter='url(%23filter-ynk201gnq)'%3E%3C/rect%3E%3C/svg%3E");
        	overflow:hidden;
        	height:100vh;
        	width:100vw;
        }
        .container{
        	position:absolute;
        	top:50%;
        	left:50%;
        	transform:translate(-50%,-50%);
        	height:100px;
        	width:100px;
        }
        .sun{
        	position:absolute;
        	top:50%;
        	left:50%;
        	transform:translate(-50%,-50%);
        	height:100px;
        	width:100px;
        	border-radius:50%;
        /* 	border:4px solid blue; */
        	box-shadow:0 0 15px rgba(255,255,255,1), inset 0 0 15px #000;
        	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' height='100%25' width='100%25'%3E%3Cfilter id='filter-zao54kfb'%3E%3CfeTurbulence baseFrequency='0.1' numOctaves='6'.........完整代码请登录后点击上方下载按钮下载查看