muzi
/
macUI
mirror of https://github.com/1099438829/macUI.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

增加min格式化html

This commit is contained in:
1099438829 2021-01-06 09:43:01 +08:00
parent 891c800ee7
commit 618c26018d
9 changed files with 338 additions and 272 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
css/animate.min.css vendored Normal file
View File

File diff suppressed because one or more lines are too long

1
css/login.min.css vendored Normal file
View File

@ -0,0 +1 @@
.cm-tab-wrap-hack::after{content:""}.com-user{position:fixed;display:flex;justify-content:center;align-items:center;background:#fff none repeat scroll 0 0}.com-user,.com-user::after{top:0;left:0;bottom:0;right:0;z-index:1000}.com-user::after{position:absolute;content:"";background:rgba(0,0,0,0) url(../img/wallpapers/main.jpg) no-repeat scroll 0 0/cover;margin:-50px;filter:blur(20px);opacity:.8}.com-user .login-box{width:200px}.com-user .login-box img{width:50px;height:50px;border-radius:50%;margin-bottom:10px}.com-user .login-box .login{position:absolute;padding:0;right:-50px;top:90px;border-radius:15px;border:medium none;background:rgba(255,255,255,.3) none repeat scroll 0 0;width:30px;color:#fff;font-size:18px;outline:medium none;height:30px;cursor:pointer}.com-user .login-box .login:active{background:rgba(255,255,255,.4) none repeat scroll 0 0}.com-user .box{z-index:1001;display:flex;flex-direction:column;position:relative;justify-content:center;align-items:center}.com-user .third img{width:32px;height:32px;cursor:pointer;margin:10px}.com-user input{width:150px;background:rgba(255,255,255,.3) none repeat scroll 0 0;border:medium none rgba(0,0,0,.3);border-radius:5px;height:25px;margin:10px 0;outline:medium none;color:#fff;text-align:center}.com-user .cancel{position:absolute;z-index:1001;bottom:22%;background:rgba(0,0,0,0) none repeat scroll 0 0;border:medium none;text-align:center;display:flex;flex-direction:column;justify-content:center;align-items:center;outline:medium none;cursor:pointer}.com-user .cancel img{opacity:.8}.com-user .cancel span{color:#fff;font-size:12px;margin-top:10px}body,html{margin:0;padding:0;font-family:sans-serif;height:100%;width:100%;overflow:hidden}button{-moz-user-select:none;cursor:default;background-color:#fff;outline:medium none;border-width:1px;border-style:solid;border-radius:5px;border-color:#c8c8c8 #c2c2c2 #acacac;box-shadow:0 1px rgba(0,0,0,.04);padding:0 13px;line-height:19px;font-family:-apple-system,BlinkMacSystemFont,Helvetica Neue,Arial,sans-serif;font-size:13px}button:active{border-color:#247fff #125eed #003ddb;background-image:-webkit-linear-gradient(top,#4c98fe,#0564e3);color:rgba(255,255,255,.9)}*{box-sizing:border-box}#root,.layout-desktop{height:100%;width:100%}.layout-desktop{background-image:url(../img/wallpapers/main.jpg);background-size:cover;display:flex;flex-direction:column}.layout-desktop .content{position:relative;height:100%;width:100%;flex:1 1 0%}.layout-desktop .icons{padding:30px}.layout-desktop .icons>div{display:flex;width:150px;height:150px;justify-content:center;align-items:center;flex-direction:column}.layout-desktop .icons>div img{max-width:60px;max-height:60px}.layout-desktop .icons>div span{margin-top:10px;color:#fff;font-size:12px}

367
demo.html
View File

@ -1,9 +1,10 @@
<!DOCTYPE html>
<html lang="zh-cn">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no"/>
<meta name="viewport" content="width=device-width,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no" />
<title>macOS</title>
<link rel='Shortcut Icon' type='image/x-icon' href='./img/favicon.ico'>
<script type="text/javascript" src="./js/jquery-2.2.4.min.js"></script>
@ -11,180 +12,220 @@
<link rel="stylesheet" href="./component/font-awesome-4.7.0/css/font-awesome.min.css">
<link rel="stylesheet" href="./css/index.css">
</head>
<body>
<div id="win10">
<div id="win10_task_bar" class="backgroud_blur">
<div id="win10_btn_group_left" class="btn_group">
<div id="win10_btn_win" class="btn"><span class="fa fa-apple"></span></div>
<div class="btn" onclick="Win10.openUrl('./app/safari','<span class=\'icon fa fa-safari\'></span>','safari')"><span class="fa fa-safari"></span></div>
<div id="win10">
<div id="win10_task_bar" class="backgroud_blur">
<div id="win10_btn_group_left" class="btn_group">
<div id="win10_btn_win" class="btn"><span class="fa fa-apple"></span></div>
<div class="btn"
onclick="Win10.openUrl('./app/safari','<span class=\'icon fa fa-safari\'></span>','safari')"><span
class="fa fa-safari"></span></div>
</div>
<div id="win10_btn_group_middle" class="btn_group"></div>
<div id="win10_btn_group_right" class="btn_group">
<div class="btn" id="win10_btn_time"></div>
<div class="btn" id="win10_btn_command"><span id="win10-msg-nof" class="fa fa-list-ul"></span></div>
<div class="btn" id="win10_btn_show_desktop"></div>
</div>
</div>
<div id="win10_btn_group_middle" class="btn_group"></div>
<div id="win10_btn_group_right" class="btn_group">
<div class="btn" id="win10_btn_time"></div>
<div class="btn" id="win10_btn_command"><span id="win10-msg-nof" class="fa fa-list-ul"></span></div>
<div class="btn" id="win10_btn_show_desktop"></div>
</div>
</div>
<div class="desktop">
<div id="win10-shortcuts" class="shortcuts-hidden">
<div class="shortcut" onclick="Win10.openUrl('http://mac.apecloud.cn','<img class=\'icon\' src=\'./img/icon/computer.png\'/>','OS官网')">
<img class="icon" src="./img/icon/computer.png"/>
<div class="title">OS官网</div>
</div>
<div class="shortcut" onclick="Win10.openUrl('http://win10ui.yuri2.cn','<img class=\'icon\' src=\'./img/icon/trashicon.png\'/>','回收站')">
<img class="icon" src="./img/icon/trashicon.png"/>
<div class="title">回收站</div>
</div>
<div class="shortcut" onclick="Win10.openUrl('https://developer.apple.com/game-center','<img class=\'icon\' src=\'./img/icon/gamecenter.png\'/>','GameCenter')">
<img class="icon" src="./img/icon/gamecenter.png"/>
<div class="title">GameCenter</div>
</div>
<div class="shortcut" onclick="Win10.openUrl('./app/calendar','<img class=\'icon\' src=\'./img/icon/calendar.png\'/>','Calendar',[['910px','675px'],'auto'])">
<img class="icon" src="./img/icon/calendar.png"/>
<div class="title">Calendar</div>
</div>
<div class="shortcut" onclick="window.open('https://www.icloud.com/')">
<img class="icon" src="./img/icon/icloud.png"/>
<div class="title">iCloud</div>
</div>
<div class="shortcut" onclick="Win10.openUrl('https://map.baidu.com','<img class=\'icon\' src=\'./img/icon/maps.png\'/>','Map')">
<img class="icon" src="./img/icon/maps.png"/>
<div class="title">地图</div>
</div>
<div class="shortcut" onclick="window.open('https://github.com/yuri2peter/win10-ui/archive/master.zip')">
<img class="icon" src="./img/icon/prefapp.png"/>
<div class="title">设置</div>
</div>
<div class="shortcut" onclick="window.open('./login.html','<i class=\'fa fa-user icon black-green\'></i>','登录页')">
<i class="fa fa-user icon black-green"></i>
<div class="title">登录页</div>
</div>
<div class="shortcut win10-open-window flipInX animated" data-url="./plugins/theme_switcher/theme_switcher.html" style="left: 92px; top: 510px;">
<img class="icon" src="./img/icon/DesktopScreenEffectsPref.png"/>
<div class="title">切换壁纸</div>
</div>
<div class="shortcut win10-drawer">
<img class="icon" src="./img/icon/folder.png"/>
<div class="title">新建文件夹</div>
<div class="win10-drawer-box">
<div class="shortcut-drawer win10-drawer">
<img class="icon" src="./img/icon/folder.png"/>
<div class="title">新建文件夹</div>
<div class="win10-drawer-box">
<div class="shortcut-drawer win10-open-window" data-url="www.baidu.com">
<i class="icon fa fa-fw fa-th-list orange"></i>
<div class="title">子项1</div>
<div class="desktop">
<div id="win10-shortcuts" class="shortcuts-hidden">
<div class="shortcut"
onclick="Win10.openUrl('http://mac.apecloud.cn','<img class=\'icon\' src=\'./img/icon/computer.png\'/>','OS官网')">
<img class="icon" src="./img/icon/computer.png" />
<div class="title">OS官网</div>
</div>
<div class="shortcut"
onclick="Win10.openUrl('http://win10ui.yuri2.cn','<img class=\'icon\' src=\'./img/icon/trashicon.png\'/>','回收站')">
<img class="icon" src="./img/icon/trashicon.png" />
<div class="title">回收站</div>
</div>
<div class="shortcut"
onclick="Win10.openUrl('https://developer.apple.com/game-center','<img class=\'icon\' src=\'./img/icon/gamecenter.png\'/>','GameCenter')">
<img class="icon" src="./img/icon/gamecenter.png" />
<div class="title">GameCenter</div>
</div>
<div class="shortcut"
onclick="Win10.openUrl('./app/calendar','<img class=\'icon\' src=\'./img/icon/calendar.png\'/>','Calendar',[['910px','675px'],'auto'])">
<img class="icon" src="./img/icon/calendar.png" />
<div class="title">Calendar</div>
</div>
<div class="shortcut" onclick="window.open('https://www.icloud.com/')">
<img class="icon" src="./img/icon/icloud.png" />
<div class="title">iCloud</div>
</div>
<div class="shortcut"
onclick="Win10.openUrl('https://map.baidu.com','<img class=\'icon\' src=\'./img/icon/maps.png\'/>','Map')">
<img class="icon" src="./img/icon/maps.png" />
<div class="title">地图</div>
</div>
<div class="shortcut"
onclick="window.open('https://github.com/yuri2peter/win10-ui/archive/master.zip')">
<img class="icon" src="./img/icon/prefapp.png" />
<div class="title">设置</div>
</div>
<div class="shortcut"
onclick="window.open('./login.html','<i class=\'fa fa-user icon black-green\'></i>','登录页')">
<i class="fa fa-user icon black-green"></i>
<div class="title">登录页</div>
</div>
<div class="shortcut win10-open-window flipInX animated"
data-url="./plugins/theme_switcher/theme_switcher.html" style="left: 92px; top: 510px;">
<img class="icon" src="./img/icon/DesktopScreenEffectsPref.png" />
<div class="title">切换壁纸</div>
</div>
<div class="shortcut win10-drawer">
<img class="icon" src="./img/icon/folder.png" />
<div class="title">新建文件夹</div>
<div class="win10-drawer-box">
<div class="shortcut-drawer win10-drawer">
<img class="icon" src="./img/icon/folder.png" />
<div class="title">新建文件夹</div>
<div class="win10-drawer-box">
<div class="shortcut-drawer win10-open-window" data-url="www.baidu.com">
<i class="icon fa fa-fw fa-th-list orange"></i>
<div class="title">子项1</div>
</div>
</div>
</div>
</div>
<div class="shortcut-drawer win10-open-window" data-url="www.baidu.com">
<i class="icon fa fa-fw fa-th-list orange"></i>
<div class="title">子项1</div>
</div>
<div class="shortcut-drawer">
<i class="icon fa fa-fw fa-th-list orange"></i>
<div class="title">子项2</div>
<div class="shortcut-drawer win10-open-window" data-url="www.baidu.com">
<i class="icon fa fa-fw fa-th-list orange"></i>
<div class="title">子项1</div>
</div>
<div class="shortcut-drawer">
<i class="icon fa fa-fw fa-th-list orange"></i>
<div class="title">子项2</div>
</div>
</div>
</div>
</div>
<div class="background blur"></div>
</div>
<div class="background blur"></div>
</div>
<div id="win10-menu" class="hidden backgroud_blur">
<div class="list win10-menu-hidden animated animated-slideOutLeft">
<div class="item"><i class="icon fa fa-wrench fa-fw"></i><span>API测试</span></div>
<div class="sub-item" onclick="Win10.openUrl('./child.html','<span class=\'icon fa fa-cubes\'></span>','子页')">父子页沟通</div>
<div class="sub-item" onclick="Win10.commandCenterOpen()">打开消息中心</div>
<div class="sub-item" onclick="Win10.newMsg('API测试','通过API可以发送消息至消息中心，自定义标题与内容(点击我试试)',function() {alert('click')})">发送带回调的消息</div>
<div class="sub-item" onclick="Win10.menuClose()">关闭菜单</div>
<div class="item" ><i class="icon fa fa-gavel fa-fw"></i>辅助工具</div>
<div class="sub-item" onclick="Win10.openUrl('win10ui.yuri2.cn/src/tools/builder-shortcut.html','<span class=\'icon fa fa-cubes\'></span>','图标代码生成器')">桌面图标代码生成器</div>
<div class="sub-item" onclick="Win10.openUrl('win10ui.yuri2.cn/src/tools/builder-tile.html','<span class=\'icon fa fa-cubes\'></span>','磁贴代码生成器')">磁贴代码生成器</div>
<div class="sub-item" onclick="Win10.openUrl('win10ui.yuri2.cn/src/tools/builder-menu.html','<span class=\'icon fa fa-cubes\'></span>','菜单代码生成器')">菜单代码生成器</div>
<div class="item" onclick="Win10.aboutUs()"><i class="icon fa fa-star fa-fw"></i>关于</div>
<div class="item" onclick=" Win10.exit();"><i class="icon fa fa-power-off fa-fw"></i>关闭</div>
<div id="win10-menu" class="hidden backgroud_blur">
<div class="list win10-menu-hidden animated animated-slideOutLeft">
<div class="item"><i class="icon fa fa-wrench fa-fw"></i><span>API测试</span></div>
<div class="sub-item"
onclick="Win10.openUrl('./child.html','<span class=\'icon fa fa-cubes\'></span>','子页')">父子页沟通</div>
<div class="sub-item" onclick="Win10.commandCenterOpen()">打开消息中心</div>
<div class="sub-item"
onclick="Win10.newMsg('API测试','通过API可以发送消息至消息中心，自定义标题与内容(点击我试试)',function() {alert('click')})">
发送带回调的消息</div>
<div class="sub-item" onclick="Win10.menuClose()">关闭菜单</div>
<div class="item"><i class="icon fa fa-gavel fa-fw"></i>辅助工具</div>
<div class="sub-item"
onclick="Win10.openUrl('win10ui.yuri2.cn/src/tools/builder-shortcut.html','<span class=\'icon fa fa-cubes\'></span>','图标代码生成器')">
桌面图标代码生成器</div>
<div class="sub-item"
onclick="Win10.openUrl('win10ui.yuri2.cn/src/tools/builder-tile.html','<span class=\'icon fa fa-cubes\'></span>','磁贴代码生成器')">
磁贴代码生成器</div>
<div class="sub-item"
onclick="Win10.openUrl('win10ui.yuri2.cn/src/tools/builder-menu.html','<span class=\'icon fa fa-cubes\'></span>','菜单代码生成器')">
菜单代码生成器</div>
<div class="item" onclick="Win10.aboutUs()"><i class="icon fa fa-star fa-fw"></i>关于</div>
<div class="item" onclick=" Win10.exit();"><i class="icon fa fa-power-off fa-fw"></i>关闭</div>
</div>
</div>
<div id="win10_command_center" class="hidden_right backgroud_blur">
<div class="command-header">
<div class="tab-today active">今天</div>
<div class="tab-msg">通知</div>
</div>
<div class="command-body today"></div>
<!-- <span id="win10_btn_command_center_clean_all">全部清除</span> -->
<div class="command-body msgs"></div>
</div>
<div id="footer">
<div class="dock backgroud_blur">
<ul>
<li><span class="dock-tips">finder<span class="arrow"></span></span><a
onclick="Win10.openUrl('./app/finder','<img class=\'icon\' src=\'./img/icon/finder.png\'/>','finder')">
<img src="./img/icon/finder.png"></a></li>
<li><span class="dock-tips">computer<span class="arrow"></span></span><a
onclick="Win10.openUrl('http://mac.apecloud.cn','<img class=\'icon\' src=\'./img/icon/computer.png\'/>','我的电脑')">
<img src="./img/icon/computer.png"></a></li>
<li><span class="dock-tips">gamecenter<span class="arrow"></span></span><a href="#"> <img
src="./img/icon/gamecenter.png"></a></li>
<li><span class="dock-tips">icloud<span class="arrow"></span></span><a href="#"> <img
src="./img/icon/icloud.png"></a></li>
<li><span class="dock-tips">prefapp<span class="arrow"></span></span><a href="#"> <img
src="./img/icon/prefapp.png"></a></li>
<li><span class="dock-tips">trashicon<span class="arrow"></span></span><a href="#"> <img
src="./img/icon/trashicon.png"></a></li>
<li><span class="dock-tips">appstore<span class="arrow"></span></span><a href="#"> <img
src="./img/icon/appstore.png"></a></li>
<li><span class="dock-tips">iTunes<span class="arrow"></span></span><a href="#"> <img
src="./img/icon/iTunes.png"></a></li>
<li><span class="dock-tips">imusic<span class="arrow"></span></span><a href="#"> <img
src="./img/icon/imusic.png"></a></li>
<li><span class="dock-tips">preview<span class="arrow"></span></span><a href="#"> <img
src="./img/icon/preview.png"></a></li>
<li><span class="dock-tips">mail<span class="arrow"></span></span><a href="#"> <img
src="./img/icon/mail.png"></a></li>
<li><span class="dock-tips">notes.png<span class="arrow"></span></span><a href="#"> <img
src="./img/icon/notes.png"></a></li>
<li><span class="dock-tips">messages<span class="arrow"></span></span><a href="#"> <img
src="./img/icon/messages.png"></a></li>
<li><span class="dock-tips">maps<span class="arrow"></span></span><a href="#"> <img
src="./img/icon/maps.png"></a></li>
<li><span class="dock-tips">ibooks<span class="arrow"></span></span><a href="#"> <img
src="./img/icon/ibooks.png"></a></li>
<li><span class="dock-tips">facetime<span class="arrow"></span></span><a href="#"> <img
src="./img/icon/facetime.png"></a></li>
<li><span class="dock-tips">launchpad<span class="arrow"></span></span><a href="#"> <img
src="./img/icon/launchpad.png"></a></li>
</ul>
</div>
</div>
</div>
<div id="win10_command_center" class="hidden_right backgroud_blur">
<div class="command-header">
<div class="tab-today active">今天</div>
<div class="tab-msg">通知</div>
</div>
<div class="command-body today"></div>
<!-- <span id="win10_btn_command_center_clean_all">全部清除</span> -->
<div class="command-body msgs"></div>
</div>
<div id="footer">
<div class="dock backgroud_blur">
<ul>
<li><span class="dock-tips">finder<span class="arrow"></span></span><a onclick="Win10.openUrl('./app/finder','<img class=\'icon\' src=\'./img/icon/finder.png\'/>','finder')"> <img src="./img/icon/finder.png"></a></li>
<li><span class="dock-tips">computer<span class="arrow"></span></span><a onclick="Win10.openUrl('http://mac.apecloud.cn','<img class=\'icon\' src=\'./img/icon/computer.png\'/>','我的电脑')"> <img src="./img/icon/computer.png"></a></li>
<li><span class="dock-tips">gamecenter<span class="arrow"></span></span><a href="#"> <img src="./img/icon/gamecenter.png"></a></li>
<li><span class="dock-tips">icloud<span class="arrow"></span></span><a href="#"> <img src="./img/icon/icloud.png"></a></li>
<li><span class="dock-tips">prefapp<span class="arrow"></span></span><a href="#"> <img src="./img/icon/prefapp.png"></a></li>
<li><span class="dock-tips">trashicon<span class="arrow"></span></span><a href="#"> <img src="./img/icon/trashicon.png"></a></li>
<li><span class="dock-tips">appstore<span class="arrow"></span></span><a href="#"> <img src="./img/icon/appstore.png"></a></li>
<li><span class="dock-tips">iTunes<span class="arrow"></span></span><a href="#"> <img src="./img/icon/iTunes.png"></a></li>
<li><span class="dock-tips">imusic<span class="arrow"></span></span><a href="#"> <img src="./img/icon/imusic.png"></a></li>
<li><span class="dock-tips">preview<span class="arrow"></span></span><a href="#"> <img src="./img/icon/preview.png"></a></li>
<li><span class="dock-tips">mail<span class="arrow"></span></span><a href="#"> <img src="./img/icon/mail.png"></a></li>
<li><span class="dock-tips">notes.png<span class="arrow"></span></span><a href="#"> <img src="./img/icon/notes.png"></a></li>
<li><span class="dock-tips">messages<span class="arrow"></span></span><a href="#"> <img src="./img/icon/messages.png"></a></li>
<li><span class="dock-tips">maps<span class="arrow"></span></span><a href="#"> <img src="./img/icon/maps.png"></a></li>
<li><span class="dock-tips">ibooks<span class="arrow"></span></span><a href="#"> <img src="./img/icon/ibooks.png"></a></li>
<li><span class="dock-tips">facetime<span class="arrow"></span></span><a href="#"> <img src="./img/icon/facetime.png"></a></li>
<li><span class="dock-tips">launchpad<span class="arrow"></span></span><a href="#"> <img src="./img/icon/launchpad.png"></a></li>
</ul>
</div>
</div>
</div>
</body>
<script type="text/javascript" src="./component/layer-v3.1.1/layer/layer.js"></script>
<script type="text/javascript" src="./js/mac.min.js"></script>
<link rel="stylesheet" href="./plugins/shortcut-drawer/shortcut-drawer.min.css">
<script type="text/javascript" src="./plugins/shortcut-drawer/shortcut-drawer.min.js"></script>
<script>
Win10.onReady(function () {
<script type="text/javascript" src="./js/mac.min.js"></script>
<link rel="stylesheet" href="./plugins/shortcut-drawer/shortcut-drawer.min.css">
<script type="text/javascript" src="./plugins/shortcut-drawer/shortcut-drawer.min.js"></script>
<script>
Win10.onReady(function () {
//设置壁纸
Win10.setBgUrl({
main:'./img/wallpapers/main.jpg',
mobile:'./img/wallpapers/mobile.jpg',
});
Win10.setAnimated([
'animated flip',
'animated bounceIn',
], 0.01);
setTimeout(function () {
Win10.newMsg('推荐全屏', '按下F11全屏以达到最佳视觉效果(点击进入)',function () {
Win10.enableFullScreen();
});
Win10.newMsg('最新资讯', '最新资讯信息',function () {
layer.open({
type: 2,
title: '最新资讯',
area: ['300px', '380px'],
shade:0,
skin:'win10-open-iframe',
offset: 'rb',
content: './broadcast.html'
});
});
}, 1500);
setTimeout(function () {
layer.open({
type: 2,
title: '最新资讯',
area: ['300px', '380px'],
shade:0,
skin:'win10-open-iframe',
offset: 'rb',
content: 'broadcast.html'
})
},2000);
//设置壁纸
Win10.setBgUrl({
main: './img/wallpapers/main.jpg',
mobile: './img/wallpapers/mobile.jpg',
});
</script>
Win10.setAnimated([
'animated flip',
'animated bounceIn',
], 0.01);
setTimeout(function () {
Win10.newMsg('推荐全屏', '按下F11全屏以达到最佳视觉效果(点击进入)', function () {
Win10.enableFullScreen();
});
Win10.newMsg('最新资讯', '最新资讯信息', function () {
layer.open({
type: 2,
title: '最新资讯',
area: ['300px', '380px'],
shade: 0,
skin: 'win10-open-iframe',
offset: 'rb',
content: './broadcast.html'
});
});
}, 1500);
setTimeout(function () {
layer.open({
type: 2,
title: '最新资讯',
area: ['300px', '380px'],
shade: 0,
skin: 'win10-open-iframe',
offset: 'rb',
content: 'broadcast.html'
})
}, 2000);
});
</script>
</html>

225
index.html
View File

@ -1,133 +1,148 @@
<!DOCTYPE html>
<html lang="zh-cn">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no"/>
<meta name="viewport" content="width=device-width,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no" />
<title>macOS</title>
<meta name="description" content="mac桌面">
<meta name="keywords" content="mac桌面">
<meta name="description" content="mac桌面">
<meta name="keywords" content="mac桌面">
<link rel='Shortcut Icon' type='image/x-icon' href='./img/favicon.ico'>
<link href="./css/animate.css" rel="stylesheet">
<link href="./component/font-awesome-4.7.0/css/font-awesome.min.css" rel="stylesheet">
<link href="./css/index.min.css" rel="stylesheet">
<link rel="stylesheet" href="./plugins/shortcut-drawer/shortcut-drawer.css">
</head>
<body>
<div id="win10">
<div id="win10_task_bar" class="backgroud_blur">
<div id="win10_btn_group_left" class="btn_group">
<div id="win10_btn_win" class="btn"><span class="fa fa-apple"></span></div>
<div class="btn" onclick="Win10.openUrl('./app/safari','<span class=\'icon fa fa-safari\'></span>','safari')"><span class="fa fa-safari"></span></div>
</div>
<div id="win10_btn_group_middle" class="btn_group"></div>
<div id="win10_btn_group_right" class="btn_group">
<div class="btn" id="win10_btn_time"></div>
<div class="btn" id="win10_btn_command"><span id="win10-msg-nof" class="fa fa-list-ul"></span></div>
<div class="btn" id="win10_btn_show_desktop"></div>
</div>
</div>
<div class="desktop">
<div id="win10-shortcuts" class="shortcuts-hidden">
<div class="shortcut" onclick="Win10.openUrl('http://mac.apecloud.cn','<img class=\'icon\' src=\'./img/icon/computer.png\'/>','OS官网')">
<img class="icon" src="./img/icon/computer.png"/>
<div class="title">OS官网</div>
<div id="win10">
<div id="win10_task_bar" class="backgroud_blur">
<div id="win10_btn_group_left" class="btn_group">
<div id="win10_btn_win" class="btn"><span class="fa fa-apple"></span></div>
<div class="btn"
onclick="Win10.openUrl('./app/safari','<span class=\'icon fa fa-safari\'></span>','safari')"><span
class="fa fa-safari"></span></div>
</div>
<div class="shortcut" onclick="window.open('./demo.html')">
<img class="icon" src="./img/icon/demo.png"/>
<div class="title">查看DEMO</div>
<div id="win10_btn_group_middle" class="btn_group"></div>
<div id="win10_btn_group_right" class="btn_group">
<div class="btn" id="win10_btn_time"></div>
<div class="btn" id="win10_btn_command"><span id="win10-msg-nof" class="fa fa-list-ul"></span></div>
<div class="btn" id="win10_btn_show_desktop"></div>
</div>
<div class="shortcut win10-drawer">
<img class="icon" src="./img/icon/folder.png"/>
<div class="title">新建文件夹</div>
<div class="win10-drawer-box">
<div class="shortcut-drawer win10-drawer">
<img class="icon" src="./img/icon/folder.png"/>
<div class="title">新建文件夹</div>
<div class="win10-drawer-box">
<div class="shortcut-drawer win10-open-window" data-url="www.baidu.com">
<i class="icon fa fa-fw fa-th-list orange"></i>
<div class="title">子项1</div>
</div>
<div class="desktop">
<div id="win10-shortcuts" class="shortcuts-hidden">
<div class="shortcut"
onclick="Win10.openUrl('http://mac.apecloud.cn','<img class=\'icon\' src=\'./img/icon/computer.png\'/>','OS官网')">
<img class="icon" src="./img/icon/computer.png" />
<div class="title">OS官网</div>
</div>
<div class="shortcut" onclick="window.open('./demo.html')">
<img class="icon" src="./img/icon/demo.png" />
<div class="title">查看DEMO</div>
</div>
<div class="shortcut win10-drawer">
<img class="icon" src="./img/icon/folder.png" />
<div class="title">新建文件夹</div>
<div class="win10-drawer-box">
<div class="shortcut-drawer win10-drawer">
<img class="icon" src="./img/icon/folder.png" />
<div class="title">新建文件夹</div>
<div class="win10-drawer-box">
<div class="shortcut-drawer win10-open-window" data-url="www.baidu.com">
<i class="icon fa fa-fw fa-th-list orange"></i>
<div class="title">子项1</div>
</div>
</div>
</div>
</div>
<div class="shortcut-drawer win10-open-window" data-url="www.baidu.com">
<i class="icon fa fa-fw fa-th-list orange"></i>
<div class="title">子项1</div>
</div>
<div class="shortcut-drawer">
<i class="icon fa fa-fw fa-th-list orange"></i>
<div class="title">子项2</div>
<div class="shortcut-drawer win10-open-window" data-url="www.baidu.com">
<i class="icon fa fa-fw fa-th-list orange"></i>
<div class="title">子项1</div>
</div>
<div class="shortcut-drawer">
<i class="icon fa fa-fw fa-th-list orange"></i>
<div class="title">子项2</div>
</div>
</div>
</div>
</div>
<div class="background blur"></div>
</div>
<div class="background blur"></div>
</div>
<div id="win10-menu" class="hidden backgroud_blur">
<div class="list win10-menu-hidden animated animated-slideOutLeft">
<div class="item" onclick="Win10.aboutUs()"><i class="icon fa fa-star fa-fw"></i>关于</div>
<div class="item" onclick=" Win10.exit();"><i class="icon fa fa-power-off fa-fw"></i>关闭</div>
<div id="win10-menu" class="hidden backgroud_blur">
<div class="list win10-menu-hidden animated animated-slideOutLeft">
<div class="item" onclick="Win10.aboutUs()"><i class="icon fa fa-star fa-fw"></i>关于</div>
<div class="item" onclick=" Win10.exit();"><i class="icon fa fa-power-off fa-fw"></i>关闭</div>
</div>
</div>
<div id="win10_command_center" class="hidden_right backgroud_blur">
<div class="command-header">
<div class="tab-today active">今天</div>
<div class="tab-msg">通知</div>
</div>
<div class="command-body today"></div>
<!-- <span id="win10_btn_command_center_clean_all">全部清除</span> -->
<div class="command-body msgs"></div>
</div>
<div id="footer">
<div class="dock backgroud_blur">
<ul>
<li><span class="dock-tips">finder<span class="arrow"></span></span><a
onclick="Win10.openUrl('./app/finder','<img src=\'./img/icon/finder.png\'/>','finder')">
<img src="./img/icon/finder.png"></a></li>
<li><span class="dock-tips">computer<span class="arrow"></span></span><a
onclick="Win10.openUrl('http://mac.apecloud.cn','<img src=\'./img/icon/computer.png\'/>','我的电脑')">
<img src="./img/icon/computer.png"></a></li>
<li><span class="dock-tips">gamecenter<span class="arrow"></span></span><a href="#"> <img
src="./img/icon/gamecenter.png"></a></li>
<li><span class="dock-tips">icloud<span class="arrow"></span></span><a href="#"> <img
src="./img/icon/icloud.png"></a></li>
<li><span class="dock-tips">prefapp<span class="arrow"></span></span><a href="#"> <img
src="./img/icon/prefapp.png"></a></li>
<li><span class="dock-tips">trashicon<span class="arrow"></span></span><a href="#"> <img
src="./img/icon/trashicon.png"></a></li>
<li><span class="dock-tips">appstore<span class="arrow"></span></span><a href="#"> <img
src="./img/icon/appstore.png"></a></li>
</ul>
</div>
</div>
</div>
<div id="win10_command_center" class="hidden_right backgroud_blur">
<div class="command-header">
<div class="tab-today active">今天</div>
<div class="tab-msg">通知</div>
</div>
<div class="command-body today"></div>
<!-- <span id="win10_btn_command_center_clean_all">全部清除</span> -->
<div class="command-body msgs"></div>
</div>
<div id="footer">
<div class="dock backgroud_blur">
<ul>
<li><span class="dock-tips">finder<span class="arrow"></span></span><a onclick="Win10.openUrl('./app/finder','<img class=\'icon\' src=\'./img/icon/finder.png\'/>','finder')"> <img src="./img/icon/finder.png"></a></li>
<li><span class="dock-tips">computer<span class="arrow"></span></span><a onclick="Win10.openUrl('http://mac.apecloud.cn','<img class=\'icon\' src=\'./img/icon/computer.png\'/>','我的电脑')"> <img src="./img/icon/computer.png"></a></li>
<li><span class="dock-tips">gamecenter<span class="arrow"></span></span><a href="#"> <img src="./img/icon/gamecenter.png"></a></li>
<li><span class="dock-tips">icloud<span class="arrow"></span></span><a href="#"> <img src="./img/icon/icloud.png"></a></li>
<li><span class="dock-tips">prefapp<span class="arrow"></span></span><a href="#"> <img src="./img/icon/prefapp.png"></a></li>
<li><span class="dock-tips">trashicon<span class="arrow"></span></span><a href="#"> <img src="./img/icon/trashicon.png"></a></li>
<li><span class="dock-tips">appstore<span class="arrow"></span></span><a href="#"> <img src="./img/icon/appstore.png"></a></li>
</ul>
</div>
</div>
</div>
<script type="text/javascript" src="./js/jquery-2.2.4.min.js"></script>
<script type="text/javascript" src="./component/layer-v3.1.1/layer/layer.js"></script>
<script type="text/javascript" src="./js/mac.min.js"></script>
<script type="text/javascript" src="./plugins/shortcut-drawer/shortcut-drawer.min.js"></script>
<script>
Win10.onReady(function () {
<script type="text/javascript" src="./js/jquery-2.2.4.min.js"></script>
<script type="text/javascript" src="./component/layer-v3.1.1/layer/layer.js"></script>
<script type="text/javascript" src="./js/mac.min.js"></script>
<script type="text/javascript" src="./plugins/shortcut-drawer/shortcut-drawer.min.js"></script>
<script>
Win10.onReady(function () {
//设置壁纸
Win10.setBgUrl({
main:'./img/wallpapers/main.jpg',
mobile:'./img/wallpapers/mobile.jpg',
});
//设置壁纸
Win10.setBgUrl({
main: './img/wallpapers/main.jpg',
mobile: './img/wallpapers/mobile.jpg',
});
Win10.setAnimated([
'animated flip',
'animated bounceIn',
], 0.01);
setTimeout(function () {
Win10.newMsg('推荐全屏', '按下F11全屏以达到最佳视觉效果(点击进入)',function () {
Win10.enableFullScreen();
})
}, 1500);
Win10.setAnimated([
'animated flip',
'animated bounceIn',
], 0.01);
setTimeout(function () {
Win10.newMsg('推荐全屏', '按下F11全屏以达到最佳视觉效果(点击进入)', function () {
Win10.enableFullScreen();
})
}, 1500);
setTimeout(function () {
layer.open({
type: 2,
title: '最新资讯',
area: ['300px', '380px'],
shade:0,
skin:'win10-open-iframe',
offset: 'rb',
content: 'broadcast.html'
})
},2000);
});
</script>
setTimeout(function () {
layer.open({
type: 2,
title: '最新资讯',
area: ['300px', '380px'],
shade: 0,
skin: 'win10-open-iframe',
offset: 'rb',
content: 'broadcast.html'
})
}, 2000);
});
</script>
</body>
</html>

1
js/login.min.js vendored Normal file
View File

@ -0,0 +1 @@
$(document).ready((function(){var animating=!1,submitPhase1=1100,submitPhase2=400,logoutPhase1=800,$login=$(".login"),$app=$(".app");function ripple(elem,e){$(".ripple").remove();var elTop=elem.offset().top,elLeft=elem.offset().left,x=e.pageX-elLeft,y=e.pageY-elTop,$ripple=$("<div class='ripple'></div>");$ripple.css({top:y,left:x}),elem.append($ripple)}$(document).on("click",".login__submit",(function(e){if(!animating){animating=!0;var that=this;ripple($(that),e),$(that).addClass("processing"),setTimeout((function(){$(that).addClass("success"),setTimeout((function(){$app.show(),$app.css("top"),$app.addClass("active")}),330),setTimeout((function(){$login.hide(),$login.addClass("inactive"),animating=!1,$(that).removeClass("success processing")}),400)}),1100)}})),$(document).on("click",".app__logout",(function(e){if(!animating){$(".ripple").remove(),animating=!0;var that=this;$(that).addClass("clicked"),setTimeout((function(){$app.removeClass("active"),$login.show(),$login.css("top"),$login.removeClass("inactive")}),680),setTimeout((function(){$app.hide(),animating=!1,$(that).removeClass("clicked")}),800)}}))}));

4
js/mac.js
View File

@ -654,7 +654,7 @@ window.Win10 = {
if (true === this.isLeap && i == (leap + 1)) this.isLeap = false
offset -= temp
if (this.isLeap == false) this.monCyl++
if (false === this.isLeap) this.monCyl++
}
if (offset == 0 && leap > 0 && i == leap + 1)
@ -1238,4 +1238,4 @@ $(function() {
var handle = Win10._handleReady[i];
handle();
}
});
});

2
js/mac.min.js vendored
View File

File diff suppressed because one or more lines are too long

1
js/win10.child.min.js vendored Normal file
View File

@ -0,0 +1 @@
window.Win10_parent=parent.Win10,window.Win10_child={close:function(){var index=parent.layer.getFrameIndex(window.name);Win10_parent._closeWin(index)},newMsg:function(title,content,handle_click){Win10_parent.newMsg(title,content,handle_click)},openUrl:function(url,title,max){var click_lock_name=Math.random();Win10_parent._iframe_click_lock_children[click_lock_name]=!0;var index=Win10_parent.openUrl(url,title,max);return setTimeout((function(){delete Win10_parent._iframe_click_lock_children[click_lock_name]}),1e3),index}};

2
plugins/shortcut-drawer/shortcut-drawer.min.js vendored
View File

@ -1 +1 @@
Win10.onReady(function(){(function(){$('body').on('click','.shortcut-drawer.win10-open-window',function(){$this=$(this);if($this.data('url')!==""){var title=$this.data('title')||'',areaAndOffset,icon;var bg=$this.data('icon-bg')?$this.data('icon-bg'):'';if($this.data('icon-image')){icon='<img class="icon '+bg+'" src="'+$this.data('icon-image')+'"/>'}if($this.data('icon-font')){icon='<i class="fa fa-fw fa-'+$this.data('icon-font')+' icon '+bg+'"></i>'}if(!title&&$this.children('.icon').length===1&&$this.children('.title').length===1){title=$this.children('.title').html();if(!icon){icon=$this.children('.icon').prop("outerHTML")}}if($this.data('area-offset')){areaAndOffset=$this.data('area-offset');if(areaAndOffset.indexOf(',')!==-1){areaAndOffset=eval(areaAndOsffset)}}Win10.openUrl($this.data('url'),icon,title,areaAndOffset)}})})(),$('body').on('click','.win10-drawer',function(){var content=$(this).find('.win10-drawer-box').html();var title=$(this).children('.title').html();var index=layer.open({type:1,shadeClose:true,skin:'drawer',area:[Win10.isSmallScreen()?"80%":"60%","50%"],closeBtn:0,title:title,content:content,});var layero=Win10.getLayeroByIndex(index);layero.find('.shortcut-drawer').click(function(){layer.close(index)})})});
Win10.onReady((function(){(function(){$("body").on("click",".shortcut-drawer.win10-open-window",(function(){if($this=$(this),""!==$this.data("url")){var title=$this.data("title")||"",areaAndOffset,icon,bg=$this.data("icon-bg")?$this.data("icon-bg"):"";$this.data("icon-image")&&(icon='<img class="icon '+bg+'" src="'+$this.data("icon-image")+'"/>'),$this.data("icon-font")&&(icon='<i class="fa fa-fw fa-'+$this.data("icon-font")+" icon "+bg+'"></i>'),title||1!==$this.children(".icon").length||1!==$this.children(".title").length||(title=$this.children(".title").html(),icon||(icon=$this.children(".icon").prop("outerHTML"))),$this.data("area-offset")&&(areaAndOffset=$this.data("area-offset"),-1!==areaAndOffset.indexOf(",")&&(areaAndOffset=eval(areaAndOsffset))),Win10.openUrl($this.data("url"),icon,title,areaAndOffset)}}))})(),$("body").on("click",".win10-drawer",(function(){var content=$(this).find(".win10-drawer-box").html(),title=$(this).children(".title").html(),index=layer.open({type:1,shadeClose:!0,skin:"drawer",area:[Win10.isSmallScreen()?"80%":"60%","50%"],closeBtn:0,title:title,content:content}),layero;Win10.getLayeroByIndex(index).find(".shortcut-drawer").click((function(){layer.close(index)}))}))}));