macUI/demo.html

152 lines
9.0 KiB
HTML
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<!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"/>
<title>mac桌面</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>
<link href="./css/animate.css" rel="stylesheet">
<script type="text/javascript" src="./component/layer-v3.0.3/layer/layer.js"></script>
<link rel="stylesheet" href="./component/font-awesome-4.7.0/css/font-awesome.min.css">
<link href="./css/macdefault.css" rel="stylesheet">
<script type="text/javascript" src="./js/mac.js"></script>
<style>
* {
font-family: "Microsoft YaHei", , "MicrosoftJhengHei", , STHeiti, MingLiu
}
</style>
<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();
})
}, 1500);
setTimeout(function () {
layer.open({
type: 2,
title: '最新资讯',
area: ['300px', '380px'],
shade:0,
skin:'win10-open-iframe',
offset: 'rb',
content: './broadcast.html'
})
},2000)
});
</script>
</head>
<body>
<div id="win10">
<div class="desktop">
<div id="win10-shortcuts" class="shortcuts-hidden">
<div class="shortcut" onclick="Win10.openUrl('http://win10ui.yuri2.cn','<img class=\'icon\' src=\'./img/icon/computer.png\'/>UI官网')">
<img class="icon" src="./img/icon/computer.png"/>
<div class="title">UI官网</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('win10ui.yuri2.cn/src/doc.php','<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="window.open('https://github.com/yuri2peter/win10-ui')">
<img class="icon" src="./img/icon/icloud.png"/>
<div class="title">iCloud</div>
</div>
<div class="shortcut" onclick="Win10.openUrl('https://www.oschina.net/p/win10-ui','<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" ondblclick='Win10.openUrl("./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;">
<i class="icon fa fa-fw fa-picture-o blue"></i>
<div class="title">切换壁纸</div>
</div>
</div>
</div>
<div id="win10-menu" class="hidden">
<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','子页')">父子页沟通</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','图标代码生成器')">桌面图标代码生成器</div>
<div class="sub-item" onclick="Win10.openUrl('win10ui.yuri2.cn/src/tools/builder-tile.html','磁贴代码生成器')">磁贴代码生成器</div>
<div class="sub-item" onclick="Win10.openUrl('win10ui.yuri2.cn/src/tools/builder-menu.html','菜单代码生成器')">菜单代码生成器</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">
<div class="title">
<h4 style="float: left">消息中心 </h4>
<span id="win10_btn_command_center_clean_all">全部清除</span>
</div>
<div class="msgs"></div>
</div>
<div id="win10_task_bar">
<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" id="win10-btn-browser"><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="footer">
<div class="dock">
<ul>
<li><span class="dock-tips">finder<span class="arrow"></span></span><a href="#"> <img src="./img/icon/finder.png"></a></li>
<li><span class="dock-tips">computer<span class="arrow"></span></span><a onclick="Win10.openUrl('http://win10ui.yuri2.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>
</html>