mirror of https://github.com/1099438829/macUI.git
parent
eda722fada
commit
b11b6e2be9
File diff suppressed because it is too large
Load Diff
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
|
Before Width: | Height: | Size: 5.8 KiB After Width: | Height: | Size: 5.8 KiB |
|
Before Width: | Height: | Size: 11 KiB After Width: | Height: | Size: 11 KiB |
File diff suppressed because one or more lines are too long
|
Before Width: | Height: | Size: 5.7 KiB After Width: | Height: | Size: 5.7 KiB |
|
Before Width: | Height: | Size: 701 B After Width: | Height: | Size: 701 B |
|
Before Width: | Height: | Size: 1.7 KiB After Width: | Height: | Size: 1.7 KiB |
|
|
@ -48,6 +48,30 @@ body {
|
|||
position: relative;
|
||||
}
|
||||
|
||||
#win10 .blur {
|
||||
-webkit-filter: blur(8px); /* Chrome, Opera */
|
||||
-moz-filter: blur(8px);
|
||||
-ms-filter: blur(8px);
|
||||
filter: blur(8px);
|
||||
filter: progid:DXImageTransform.Microsoft.Blur(PixelRadius=8, MakeShadow=false);
|
||||
transition: filter 0.3s;
|
||||
transition: -webkit-filter 0.3s;
|
||||
transition: -moz-filter 0.3s;
|
||||
transition: -ms-filter 0.3s;
|
||||
}
|
||||
|
||||
#win10 .desktop .background {
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
top: 0;
|
||||
left: 0;
|
||||
z-index: -999;
|
||||
transform: scale3d(1.1, 1.1, 1);
|
||||
background-size: 100% 100%;
|
||||
background-position: center center;
|
||||
}
|
||||
|
||||
#win10 *{
|
||||
scrollbar-arrow-color: #5e6a5c; /*图6,三角箭头的颜色*/
|
||||
scrollbar-face-color: #5e6a5c; /*图5,立体滚动条的颜色*/
|
||||
|
|
@ -75,7 +99,7 @@ body {
|
|||
height: 30px;
|
||||
line-height:30px;
|
||||
/* IE9+ */
|
||||
background-color:rgba(255,255,255,0.5);
|
||||
background-color:rgba(255,255,255,0.4);
|
||||
/* IE6-IE8 */
|
||||
filter:progid:DXImageTransform.Microsoft.Gradient(startColorStr=#68FFFFFF,endColorStr=#68FFFFFF);
|
||||
z-index: 19930813;
|
||||
|
|
@ -853,12 +877,12 @@ body {
|
|||
}
|
||||
|
||||
/*右键菜单*/
|
||||
#win10 .win10-context-menu { left: 0;top: 0;position: fixed; width: 150px; height: auto; background-color: rgba(255,255,255,0.75); border: #CCC 1px solid; display: block; border-radius: 5px; z-index: 99999999; }
|
||||
#win10 .win10-context-menu { left: 0;top: 0;position: fixed; width: 150px; height: auto; background-color: rgba(255, 255, 255,0.75); border: #CCC 1px solid; display: block; border-radius: 5px; z-index: 99999999; }
|
||||
#win10 .win10-context-menu ul { margin: 0px; padding: 0px; }
|
||||
#win10 .win10-context-menu ul li {transition: background-color 0.5s;cursor: default;padding: 0px 1em; list-style: none; line-height: 30px; height: 30px; margin: 3px 0; font-size: 13px; }
|
||||
#win10 .win10-context-menu ul li:hover { background-color: rgba(49,156,241,0.71);cursor: pointer; }
|
||||
#win10 .win10-context-menu ul li a {text-decoration: none; display: block; height: 100%; color: #333; outline: none; }
|
||||
#win10 .win10-context-menu ul hr { margin: 0; height: 0px; border: 0px; border-bottom: rgb(233,233,233) 1px solid;border-top: none }
|
||||
#win10 .win10-context-menu ul hr { margin: 0; height: 0px; border: 0px; border-bottom: rgba(233,233,233) 1px solid;border-top: none }
|
||||
|
||||
/*块级按钮*/
|
||||
.win10-open-iframe .layui-layer-ico{background-image:none;}
|
||||
|
|
@ -879,6 +903,10 @@ body {
|
|||
overflow: hidden;
|
||||
margin:0px;
|
||||
}
|
||||
.win10-open-iframe .layui-layer-title{
|
||||
line-height:30px;
|
||||
height: 30px;
|
||||
}
|
||||
|
||||
.win10-open-iframe .layui-layer-title{
|
||||
line-height:30px;
|
||||
|
|
|
|||
26
demo.html
26
demo.html
|
|
@ -8,12 +8,12 @@
|
|||
<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="./component/layer-v3.1.1/layer/layer.js"></script>
|
||||
<script type="text/javascript" src="./js/mac.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>
|
||||
<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 () {
|
||||
|
||||
|
|
@ -45,15 +45,15 @@
|
|||
}, 1500);
|
||||
|
||||
setTimeout(function () {
|
||||
layer.open({
|
||||
type: 2,
|
||||
title: '最新资讯',
|
||||
area: ['300px', '380px'],
|
||||
shade:0,
|
||||
layer.open({
|
||||
type: 2,
|
||||
title: '最新资讯',
|
||||
area: ['300px', '380px'],
|
||||
shade:0,
|
||||
skin:'win10-open-iframe',
|
||||
offset: 'rb',
|
||||
content: './broadcast.html'
|
||||
})
|
||||
offset: 'rb',
|
||||
content: 'broadcast.html'
|
||||
})
|
||||
},2000);
|
||||
});
|
||||
</script>
|
||||
|
|
@ -95,8 +95,7 @@
|
|||
<div class="title">切换壁纸</div>
|
||||
</div>
|
||||
<div class="shortcut win10-drawer">
|
||||
<img class="icon" src="./img/icon/folder.png"/><!--
|
||||
<i class="icon fa fa-fw fa-folder" style="color: blue;font-size: 50px;"></i> -->
|
||||
<img class="icon" src="./img/icon/folder.png"/>
|
||||
<div class="title">新建文件夹</div>
|
||||
<div class="win10-drawer-box">
|
||||
<div class="shortcut-drawer win10-drawer">
|
||||
|
|
@ -120,6 +119,7 @@
|
|||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="background blur"></div>
|
||||
</div>
|
||||
|
||||
<div id="win10-menu" class="hidden">
|
||||
|
|
|
|||
25
index.html
25
index.html
|
|
@ -8,9 +8,9 @@
|
|||
<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="./component/layer-v3.1.1/layer/layer.js"></script>
|
||||
<script type="text/javascript" src="./js/mac.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>
|
||||
|
|
@ -34,15 +34,15 @@
|
|||
}, 1500);
|
||||
|
||||
setTimeout(function () {
|
||||
layer.open({
|
||||
type: 2,
|
||||
title: '最新资讯1',
|
||||
area: ['300px', '380px'],
|
||||
shade:0,
|
||||
layer.open({
|
||||
type: 2,
|
||||
title: '最新资讯',
|
||||
area: ['300px', '380px'],
|
||||
shade:0,
|
||||
skin:'win10-open-iframe',
|
||||
offset: 'rb',
|
||||
content: './broadcast.html'
|
||||
})
|
||||
offset: 'rb',
|
||||
content: 'broadcast.html'
|
||||
})
|
||||
},2000);
|
||||
});
|
||||
</script>
|
||||
|
|
@ -71,13 +71,13 @@
|
|||
<img class="icon" src="./img/icon/demo.png"/>
|
||||
<div class="title">查看DEMO</div>
|
||||
</div>
|
||||
<div class="shortcut win10-drawer">
|
||||
<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>
|
||||
<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>
|
||||
|
|
@ -96,6 +96,7 @@
|
|||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="background blur"></div>
|
||||
</div>
|
||||
<div id="win10-menu" class="hidden">
|
||||
<div class="list win10-menu-hidden animated animated-slideOutLeft">
|
||||
|
|
|
|||
26
js/mac.js
26
js/mac.js
|
|
@ -8,14 +8,7 @@ window.Win10 = {
|
|||
main:'',
|
||||
mobile:'',
|
||||
},
|
||||
_blur:{
|
||||
win10:0,
|
||||
task_bar:0,
|
||||
desktop:0,
|
||||
menu:0,
|
||||
command:0,
|
||||
footer:0,
|
||||
},
|
||||
_wallpaperBlur: true, //壁纸模糊（影响性能）
|
||||
_countTask: 0,
|
||||
_newMsgCount:0,
|
||||
_animated_classes:[],
|
||||
|
|
@ -121,22 +114,7 @@ window.Win10 = {
|
|||
}
|
||||
//开始渲染壁纸模糊
|
||||
if(Win10._wallpaperBlur){
|
||||
this.loadScript('js/background-blur.min.js',function(){
|
||||
var $avatarHolderEl = $('#win10');
|
||||
$avatarHolderEl.backgroundBlur({
|
||||
imageURL : Win10._bgs.main,
|
||||
blurAmount : 20,
|
||||
imageClass : 'avatar-blur'
|
||||
});
|
||||
});
|
||||
$.getScript("js/background-blur.min.js",function(){ //加载test.js,成功后，并执行回调函数
|
||||
var $avatarHolderEl = $('#win10');
|
||||
$avatarHolderEl.backgroundBlur({
|
||||
imageURL : Win10._bgs.main,
|
||||
blurAmount : 20,
|
||||
imageClass : 'avatar-blur'
|
||||
});
|
||||
});
|
||||
$('.background').addClass('blur');
|
||||
}
|
||||
},
|
||||
_startAnimate:function () {
|
||||
|
|
|
|||
Loading…
Reference in New Issue