<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script src="../js/clock.js"></script>
<link rel="stylesheet" href="../css/clock.css" />
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/animate.css/4.1.1/animate.min.css"/>
<script src="https://s3.pstatp.com/cdn/expire-1-M/jquery/3.2.1/jquery.min.js"></script>
<script src="https://eqcn.ajz.miesnfu.com/wp-content/plugins/wp-3d-pony/live2dw/lib/L2Dwidget.min.js"></script>
<script src="Camera/camera.js"></script>
<style type="text/css">
body{
padding: 0px;
margin: 0px;
overflow-x:hidden;
overflow-y:hidden;
}
.bgImg{
width: 100%;
height: 900px;
padding: 0px;
margin: 0px;
user-select: none;
z-index: -1;
}
.menuBar{
position: absolute;
bottom:0px;
width: 100%;
height: 39px;
background-image: linear-gradient(#1c224e, #022f4e,#1c224e);
/*background-color: #3b3e5a;*/
opacity: 1;
z-index: 10;
}
.startOfmenuBar{
position: absolute;
top: 0%;
left: 2px;
color: ghostwhite;
height: 100%;
width: 80px;
/*background-color: #5454b0;*/
background-image: radial-gradient( #5454b0, #0b4a66);
border-radius: 8px;
opacity: 0.8;
}
.startOfmenuBar:hover{
position: absolute;
top: 0%;
left: 0%;
color: ghostwhite;
height: 100%;
background-color: #5454b0;
border-radius: 8px;
width: 83px;
opacity: 1;
}
.startOfmenuBarClick{
position: absolute;
top: 0%;
left: 0%;
color: ghostwhite;
height: 100%;
background-color: #3e1f8a;
border-radius: 8px;
width: 83px;
opacity: 1;
}
.startText{
position: absolute;
top: 18%;
left: 23%;
}
#menu{
position: absolute;
bottom: 39px;
height: 400px;
width: 230px;
border-radius: 3px;
z-index: 9;
display: none;
overflow-y: scroll;
}
/*.menubg{*/
/* background-color: #427c51;*/
/* height: 100%;*/
/* width: 100%;*/
/* z-index: 3;*/
/* opacity: 0.8;*/
/*}*/
.menubg{
position: absolute;
top: 0; left: 0;
padding-top: 20px;
/*background-color: #427c51;*/
background-color: #2b80ff;
height: 500px;
width: 100%;
opacity: 0.5;
box-shadow:2px 2px 5px #606060;
}
.menuListQ{
display: inline-block;
margin: 5% 5% 0 5%;
width: 90%;
height: 16%;
background-color: #94ccff;
border-radius: 5px;
transition: 0.5s;
position: relative;
text-align: center;
z-index: 4;
opacity: 0.8;
}
.menuListQ:hover{
background-color: #bddfff;
}
.appiconQ{
height: 60%;
position: absolute;
left: 20%;
top: 6.65%;
}
.appnameQ{
position: absolute;
top: 34%;
left: 45%;
}
/* .menuList_child{
width: 100px;
height: 100px;
position: relative;
line-height:100px;
text-align:center;
} */
.appiconQ{
height: 60%;
margin-top: 5%;
/* position: absolute;
left: 30%;
vertical-align:middle */
}
.appnameQ{
position: absolute;
}
.animate__animated.animate__fadeOutDown {
--animate-duration: 0.6s;
}
/*:root {*/
/* --animate-delay: 0s;*/
/*}*/
.dateTime{
position:absolute;
bottom:0px;
right:0px;
height: 100%;
width: 60px;
/*background-color: #054d85;*/
background-image: radial-gradient( #054d85, #2f90bc);
opacity: 1;
border-radius: 8px;
}#dateTime{
position:absolute;
top: 10px;
right:47px;
height: 90%;
width: 1.5%;
font-size: 14px;
font-family: Sans-serif;
font-weight:530;
color: aliceblue;
}
#mypc{
position: absolute;
top: 20px;
left: 20px;
width: 50px;
height: 70px;
z-index: 3;
-moz-user-select: none;
-webkit-user-select: none;
-ms-user-select: none;
-khtml-user-select: none;
user-select: none;
}
.mypcImg{
position: absolute;
top: 0px;
left: 0px;
width: 50px;
height: 50px;
opacity: 0.8;
z-index: 2;
}
.mypcImg:hover{
position: absolute;
top: -3px;
left: -3px;
width: 56px;
height: 56px;
opacity: 1;
z-index: 2;
}
.mypcText{
position: absolute;
bottom: 5%;
left: 1%;
color: white;
font-size: 10px;
opacity: 0.85;
z-index: 2;
}
#mypcWindow{
position: absolute;
display: none;
top: 80px;
left: 25%;
width: 600px;
height: 450px;
/*background-color: #6fe37a;*/
/*opacity: 0.8;*/
}
.mypcWinBg{
position: absolute;
top: 0px;
left: 0%;
width: 600px;
height: 450px;
background-image: linear-gradient(to bottom left, #25812e, #022f4e);
opacity: 0.9;
border-radius: 8px;
}
#mypcWinClose{
position: absolute;
top: 5px;
right: 8px;
width: 25px;
height: 25px;
/*background-color: #2b472e;*/
}
.mypcWinCloseBg{
position: absolute;
top: 0px;
left: 0px;
height: 100%;
width: 100%;
opacity: 0.9;
}
#mypcWinSmall{
position: absolute;
top: 3px;
right: 38px;
width: 30px;
height: 30px;
/*background-color: #2b472e;*/
}
.mypcWinSmallBg{
position: absolute;
top: 0px;
left: 0px;
height: 100%;
width: 100%;
}
.mypcOfmenuBar{
position: absolute;
top: 0%;
left: 120px;
height: 100%;
width: 45px;
/*background-color: #5454b0;*/
border-radius: 8px;
animation:animate__fadeInRight;
animation-duration: 0.6s;
}
.mypcOfmenuBarYes{
position: absolute;
top: 0%;
left: 120px;
height: 100%;
width: 150px;
background: rgba(66, 118, 221, 0.4);
animation:zoomInDown;
animation-duration: 1.5s;
/*background-color: #5454b0;*/
border-radius: 8px;
基于H5的WindowsX plus 原生js html 模拟window的小demo
需积分: 0 61 浏览量
2020-12-24
17:36:45
上传
评论
收藏 44.41MB ZIP 举报
基于H5的WindowsX plus 原生js html 模拟window的小demo （129个子文件） 
fontawesome.css 46KB main.css 19KB style.css 6KB clock.css 2KB mine.css 2KB clear-sans.css 1003B solid.css 649B system.css 514B .DS_Store 6KB .DS_Store 6KB fa-solid-900.eot 176KB ClearSans-Light-webfont.eot 25KB ClearSans-Bold-webfont.eot 23KB ClearSans-Regular-webfont.eot 23KB
timg2.gif 1.03MB timg.gif 277KB timg3.gif 277KB hello 18B
Desktop.html 80KB index.html 25KB 404.html 15KB index.html 12KB myComputer.html 9KB login.html 7KB test.html 6KB startAn.html 5KB index.html 3KB index.html 2KB start.html 2KB photoR.html 1KB loginAn.html 910B WindowAn.html 535B favicon.ico 4KB windows xp.iml 458B
windoge.jpg 114KB 3.jpg 70KB 1.jpg 54KB 4.jpg 48KB 2.jpg 30KB 5.jpg 14KB jquery.js 261KB jquery.min.js 85KB game_manager.js 7KB index.js 7KB game.js 6KB html_actuator.js 4KB keyboard_input_manager.js 4KB markedSquare.js 3KB grid.js 2KB server.js 2KB classlist_polyfill.js 2KB local_storage_manager.js 2KB camera.js 1KB test2.js 1KB clock.js 936B animframe_polyfill.js 890B tile.js 594B bind_polyfill.js 220B application.js 197B index.md 1KB 5.mp3 11.01MB 3.mp3 9.85MB 4.mp3 8.33MB 1.mp3 7.68MB 2.mp3 2.97MB
winBlack.png 1.8MB Kon001.png 1.06MB wallpaper.png 301KB clock-back.png 155KB menu.png 136KB logo.png 80KB icons-super-mario.png 29KB taskbar.png 27KB kaishi.png 19KB cuowu.png 13KB wenhao_huabanfuben.png 13KB windows.png 12KB camera.png 11KB 2048.png 11KB wulumuqishigongandashujuguanlipingtai-ico-.png 11KB 128.png 10KB 512.png 10KB zuidahua.png 9KB saoleix.png 9KB 64.png 9KB 16.png 8KB musicicon.png 8KB light-begin.png 8KB zuixiaohua.png 8KB begin.png 7KB hover-begin.png 7KB 256.png 7KB 2.png 7KB 4.png 6KB 32.png 6KB 1024.png 6KB light.png 6KB 2048.png 6KB apple-touch-icon.png 6KB netclose.png 5KB共 129 条
- 1
- 2
资源评论
