新版本
|
|
@ -2,6 +2,9 @@
|
|||
body,a,h1,h2,h3,h4,h5,h6,p,div,em,ul,li {
|
||||
font-family: PingFangSC-Ultralight, 'microsoft yahei';
|
||||
}
|
||||
* {
|
||||
font-family: "Microsoft YaHei", 微软雅黑, "MicrosoftJhengHei", 华文细黑, STHeiti, MingLiu
|
||||
}
|
||||
html {
|
||||
height: 100%;
|
||||
}
|
||||
|
|
@ -47,7 +50,7 @@ body {
|
|||
}
|
||||
|
||||
#win10 *{
|
||||
scrollbar-arrow-color: #5e6a5c;); /*图6,三角箭头的颜色*/
|
||||
scrollbar-arrow-color: #5e6a5c; /*图6,三角箭头的颜色*/
|
||||
scrollbar-face-color: #5e6a5c; /*图5,立体滚动条的颜色*/
|
||||
scrollbar-3dlight-color: #5e6a5c; /*图1,立体滚动条亮边的颜色*/
|
||||
scrollbar-highlight-color: #5e6a5c; /*图2,滚动条空白部分的颜色*/
|
||||
|
|
@ -71,7 +74,10 @@ body {
|
|||
top: 0;
|
||||
height: 30px;
|
||||
line-height:30px;
|
||||
background-color: rgba(255, 255, 255, 0.75);
|
||||
/* IE9+ */
|
||||
background-color: rgba(255,255,255,0.4);
|
||||
/* IE6-IE8 */
|
||||
filter:progid:DXImageTransform.Microsoft.Gradient(startColorStr=#68FFFFFF,endColorStr=#68FFFFFF);
|
||||
z-index: 19930813;
|
||||
}
|
||||
|
||||
|
|
@ -181,7 +187,7 @@ body {
|
|||
#win10-menu {
|
||||
position: fixed;
|
||||
top: 30px;
|
||||
background-color: rgba(255,255,255,0.75);
|
||||
background-color: rgba(255,255,255,0.55);
|
||||
height:auto;
|
||||
width: 12.5%;
|
||||
max-width: 880px;
|
||||
|
|
@ -321,9 +327,6 @@ body {
|
|||
color: grey;
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
#win10 #win10-shortcuts {
|
||||
height: calc(100% - 40px);
|
||||
position: relative;
|
||||
|
|
@ -375,7 +378,7 @@ body {
|
|||
right: 0;
|
||||
top: 30px;
|
||||
width: 350px;
|
||||
background-color: rgba(255,255,255,0.7);
|
||||
background-color: rgba(255,255,255,0.55);
|
||||
height: calc(100% - 30px);
|
||||
transition: all 0.5s;
|
||||
overflow-x: hidden;
|
||||
|
|
@ -761,93 +764,65 @@ body {
|
|||
z-index: 0;
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
/*--------------尾部--------------------*/
|
||||
#footer{
|
||||
height: 60px;
|
||||
width: 100%;
|
||||
position: absolute;
|
||||
bottom: 10px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
#footer .dock{
|
||||
/*width: 72%; */
|
||||
height: 100%;
|
||||
line-height: 60px;
|
||||
display: inline-block;
|
||||
border-radius: 5px;
|
||||
background-color: rgba(255,255,255,0.45) ;/* IE9、标准浏览器、IE6和部分IE7内核的浏览器(如QQ浏览器)会读懂 */
|
||||
-webkit-box-shadow: 0 0 50px 0 rgba(0, 0, 0, 0.8);
|
||||
-moz-box-shadow: 0 0 50px 0 rgba(0, 0, 0, 0.8);
|
||||
box-shadow: 0 0 50px 0 rgba(0, 0, 0, 0.8);
|
||||
-webkit-border-top-left-radius: 6px;
|
||||
-webkit-border-top-right-radius: 6px;
|
||||
.dock {
|
||||
width: 100%;
|
||||
bottom: 0px;
|
||||
position: absolute;
|
||||
left: 0px;
|
||||
height: 65px;
|
||||
text-align: center;
|
||||
z-index:1000;
|
||||
}
|
||||
@media \0screen\,screen\9 {/* 只支持IE6、7、8 */
|
||||
#footer .dock{
|
||||
/*width: 72%; */
|
||||
height: 100%;
|
||||
line-height: 60px;
|
||||
background-color: #fff;
|
||||
display: inline-block;
|
||||
border-radius: 5px;
|
||||
filter:Alpha(opacity=0.45);
|
||||
position:static; /* IE6、7、8只能设置position:static(默认属性) ,否则会导致子元素继承Alpha值 */
|
||||
*zoom:1; /* 激活IE6、7的haslayout属性,让它读懂Alpha */
|
||||
}
|
||||
.demo ul{
|
||||
position: relative;/* 设置子元素为相对定位,可让子元素不继承Alpha值 */
|
||||
}
|
||||
}
|
||||
#footer .dock ul{
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
#footer .dock img{
|
||||
z-index:222;
|
||||
width: 50px;
|
||||
height: 50px;
|
||||
}
|
||||
|
||||
#footer .dock ul li{
|
||||
float: left;
|
||||
margin: 5px 10px;
|
||||
/*过渡的时间 效果*/
|
||||
-webkit-transition: 0.15s linear;
|
||||
}
|
||||
|
||||
#footer .dock ul li:hover{
|
||||
/*参照*/
|
||||
-webkit-transform-origin:bottom center;
|
||||
/*形变*/
|
||||
-webkit-transform:scale(1.5);
|
||||
}
|
||||
|
||||
#footer .dock .dock-tips{
|
||||
color:white;
|
||||
font-size:0.4em;
|
||||
.dock-container {
|
||||
position: absolute;
|
||||
height: 60px;
|
||||
border-radius: 5px;
|
||||
background: rgba(0,0,0,0.5);
|
||||
height: 20px;
|
||||
line-height: 20px;
|
||||
background-color: rgba(255,255,255,0.45) ;/* IE9、标准浏览器、IE6和部分IE7内核的浏览器(如QQ浏览器)会读懂 */
|
||||
padding:0 20px;
|
||||
}
|
||||
|
||||
.dock a.dock-item {
|
||||
display: block;
|
||||
font: bold 12px Arial, Helvetica, sans-serif;
|
||||
width: 60px;
|
||||
color: #fff;
|
||||
bottom: 0px;
|
||||
position: absolute;
|
||||
text-align: center;
|
||||
text-decoration: none;
|
||||
}
|
||||
.dock-item span {
|
||||
display: none;
|
||||
padding:0px 10px;
|
||||
margin-top: -30px;
|
||||
margin-bottom: 10px;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
padding:3px 0px;
|
||||
border-radius: 5px;
|
||||
background-color: rgba(0,0,0,0.45);
|
||||
}
|
||||
#footer .dock .dock-tips .arrow{
|
||||
opacity: 0.5;
|
||||
border-left:5px solid transparent;
|
||||
border-right:5px solid transparent;
|
||||
border-top:5px solid #000;
|
||||
border-bottom:5px solid transparent;
|
||||
width:0;
|
||||
height:0;
|
||||
.dock-item img {
|
||||
border: none;
|
||||
margin: 5px;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
@media \0screen\,screen\9 {/* 只支持IE6、7、8 */
|
||||
.dock{
|
||||
/*width: 72%; */
|
||||
height: 100%;
|
||||
line-height: 60px;
|
||||
background-color: #fff;
|
||||
display: inline-block;
|
||||
border-radius: 5px;
|
||||
filter:Alpha(opacity=0.45);
|
||||
position:static; /* IE6、7、8只能设置position:static(默认属性) ,否则会导致子元素继承Alpha值 */
|
||||
*zoom:1; /* 激活IE6、7的haslayout属性,让它读懂Alpha */
|
||||
}
|
||||
.dock ul{
|
||||
position: relative;/* 设置子元素为相对定位,可让子元素不继承Alpha值 */
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
/*各种颜色 具体效果见 https://www.kancloud.cn/qq85569256/xzui/350010*/
|
||||
.win10-open-iframe .black-green, #win10 .black-green{background:#009688!important;}
|
||||
.win10-open-iframe .green,#win10 .green{background:#5FB878!important;}
|
||||
|
|
@ -940,11 +915,8 @@ body {
|
|||
.win10-open-iframe .layui-layer-setwin a {
|
||||
width: 32px;
|
||||
}
|
||||
#footer{
|
||||
bottom:0;
|
||||
}
|
||||
|
||||
#footer .dock{
|
||||
.dock{
|
||||
width: 100%;
|
||||
border-radius: 0px;
|
||||
}
|
||||
|
|
|
|||
79
demo.html
|
|
@ -6,17 +6,13 @@
|
|||
<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/apple.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/jquery-2.2.4.min.js"></script>
|
||||
<script type="text/javascript" src="./js/interface.js"></script>
|
||||
<script type="text/javascript" src="./component/layer-v3.0.3/layer/layer.js"></script>
|
||||
<script type="text/javascript" src="./js/mac.js"></script>
|
||||
<style>
|
||||
* {
|
||||
font-family: "Microsoft YaHei", 微软雅黑, "MicrosoftJhengHei", 华文细黑, STHeiti, MingLiu
|
||||
}
|
||||
</style>
|
||||
<script>
|
||||
Win10.onReady(function () {
|
||||
|
||||
|
|
@ -45,36 +41,9 @@
|
|||
offset: 'rb',
|
||||
content: 'broadcast.html'
|
||||
})
|
||||
},2000)
|
||||
|
||||
|
||||
},2000);
|
||||
});
|
||||
|
||||
//dock特效 感谢安震110
|
||||
$(function () {
|
||||
dock();
|
||||
});
|
||||
$(window).resize(function() {
|
||||
dock();
|
||||
});
|
||||
dock=function(){
|
||||
var width=document.body.clientWidth;
|
||||
if(width>768){
|
||||
$("#footer .dock li a img").hover(
|
||||
function(){
|
||||
$(this).parent('a').prev().css('display','flex');
|
||||
},
|
||||
function(){
|
||||
$(this).parent('a').prev().css('display','none');
|
||||
}
|
||||
);
|
||||
}else{
|
||||
$("#footer .dock li a img").hover(function(){
|
||||
$(this).parent('a').prev().css('display','none');
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
|
|
@ -153,29 +122,21 @@
|
|||
<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>
|
||||
<!--bottom dock -->
|
||||
<div class="dock" id="dock">
|
||||
<div class="dock-container">
|
||||
<a class="dock-item" href="#"><span>finder</span><img src="./img/icon/finder.png" alt="finder" /></a>
|
||||
<a class="dock-item" href="#"><span>appstore</span><img src="./img/icon/appstore.png" alt="appstore" /></a>
|
||||
<a class="dock-item" href="#"><span>gamecenter</span><img src="./img/icon/gamecenter.png" alt="gamecenter" /></a>
|
||||
<a class="dock-item" href="#"><span>imusic</span><img src="./img/icon/imusic.png" alt="imusic" /></a>
|
||||
<a class="dock-item" href="#"><span>notes</span><img src="./img/icon/notes.png" alt="notes" /></a>
|
||||
<a class="dock-item" href="#"><span>setting</span><img src="./img/icon/icloud.png" alt="setting" /></a>
|
||||
<a class="dock-item" href="#"><span>iTunes</span><img src="./img/icon/iTunes.png" alt="iTunes" /></a>
|
||||
<a class="dock-item" href="#"><span>mail</span><img src="./img/icon/mail.png" alt="mail" /></a>
|
||||
<a class="dock-item" href="#"><span>maps</span><img src="./img/icon/maps.png" alt="maps" /></a>
|
||||
<a class="dock-item" href="#"><span>trashicon</span><img src="./img/icon/trashicon.png" alt="trashicon" /></a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
88
index.html
|
|
@ -6,11 +6,12 @@
|
|||
<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/apple.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/jquery-2.2.4.min.js"></script>
|
||||
<script type="text/javascript" src="./js/interface.js"></script>
|
||||
<script type="text/javascript" src="./component/layer-v3.0.3/layer/layer.js"></script>
|
||||
<script type="text/javascript" src="./js/mac.js"></script>
|
||||
<style>
|
||||
* {
|
||||
|
|
@ -22,40 +23,32 @@
|
|||
|
||||
//设置壁纸
|
||||
Win10.setBgUrl({
|
||||
main: './img/wallpapers/main.jpg',
|
||||
mobile: './img/wallpapers/mobile.jpg',
|
||||
main:'./img/wallpapers/main.jpg',
|
||||
mobile:'./img/wallpapers/mobile.jpg',
|
||||
});
|
||||
|
||||
Win10.setAnimated([
|
||||
'animated flip',
|
||||
'animated bounceIn',
|
||||
], 0.01);
|
||||
|
||||
setTimeout(function () {
|
||||
Win10.newMsg('官方交流一群', '欢迎各位大侠加入讨论:<a target="_blank" href="https://jq.qq.com/?_wv=1027&k=4Er0u8i">[点击加入]205546163</a>')
|
||||
}, 2500);
|
||||
|
||||
setTimeout(function () {
|
||||
layer.open({
|
||||
type: 2,
|
||||
title: '最新资讯',
|
||||
area: ['300px', '380px'],
|
||||
shade:0,
|
||||
skin:'win10-open-iframe',
|
||||
offset: 'rb',
|
||||
content: 'broadcast.html'
|
||||
})
|
||||
},2000);
|
||||
});
|
||||
//dock特效 感谢安震110
|
||||
$(function () {
|
||||
dock();
|
||||
});
|
||||
$(window).resize(function() {
|
||||
dock();
|
||||
});
|
||||
dock=function(){
|
||||
var width=document.body.clientWidth;
|
||||
console.log(width);
|
||||
if(width>768){
|
||||
$("#footer .dock li a img").hover(
|
||||
function(){
|
||||
$(this).parent('a').prev().css('display','flex');
|
||||
},
|
||||
function(){
|
||||
$(this).parent('a').prev().css('display','none');
|
||||
}
|
||||
);
|
||||
}else{
|
||||
$("#footer .dock li a img").hover(function(){
|
||||
$(this).parent('a').prev().css('display','none');
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
|
|
@ -113,29 +106,20 @@
|
|||
<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 class="dock" id="dock">
|
||||
<div class="dock-container">
|
||||
<a class="dock-item" href="#" onclick="Win10.openUrl('http://win10ui.yuri2.cn','<img class=\'icon\' src=\'./img/icon/computer.png\'/>UI官网')" ><span>finder</span><img src="./img/icon/finder.png" alt="finder" /></a>
|
||||
<a class="dock-item" href="#"><span>appstore</span><img src="./img/icon/appstore.png" alt="appstore" /></a>
|
||||
<a class="dock-item" href="#"><span>gamecenter</span><img src="./img/icon/gamecenter.png" alt="gamecenter" /></a>
|
||||
<a class="dock-item" href="#"><span>imusic</span><img src="./img/icon/imusic.png" alt="imusic" /></a>
|
||||
<a class="dock-item" href="#"><span>notes</span><img src="./img/icon/notes.png" alt="notes" /></a>
|
||||
<a class="dock-item" href="#"><span>setting</span><img src="./img/icon/icloud.png" alt="setting" /></a>
|
||||
<a class="dock-item" href="#"><span>iTunes</span><img src="./img/icon/iTunes.png" alt="iTunes" /></a>
|
||||
<a class="dock-item" href="#"><span>mail</span><img src="./img/icon/mail.png" alt="mail" /></a>
|
||||
<a class="dock-item" href="#"><span>maps</span><img src="./img/icon/maps.png" alt="maps" /></a>
|
||||
<a class="dock-item" href="#"><span>trashicon</span><img src="./img/icon/trashicon.png" alt="trashicon" /></a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,717 @@
|
|||
/*
|
||||
* Interface elements for jQuery - http://interface.eyecon.ro
|
||||
*
|
||||
* Copyright (c) 2006 Stefan Petre
|
||||
* Dual licensed under the MIT (MIT-LICENSE.txt)
|
||||
* and GPL (GPL-LICENSE.txt) licenses.
|
||||
*/
|
||||
jQuery.iUtil = {
|
||||
getPosition: function(e) {
|
||||
var x = 0;
|
||||
var y = 0;
|
||||
var restoreStyle = false;
|
||||
var es = e.style;
|
||||
if (jQuery(e).css('display') == 'none') {
|
||||
oldVisibility = es.visibility;
|
||||
oldPosition = es.position;
|
||||
es.visibility = 'hidden';
|
||||
es.display = 'block';
|
||||
es.position = 'absolute';
|
||||
restoreStyle = true
|
||||
}
|
||||
var el = e;
|
||||
while (el) {
|
||||
x += el.offsetLeft + (el.currentStyle && !jQuery.browser.opera ? parseInt(el.currentStyle.borderLeftWidth) || 0: 0);
|
||||
y += el.offsetTop + (el.currentStyle && !jQuery.browser.opera ? parseInt(el.currentStyle.borderTopWidth) || 0: 0);
|
||||
el = el.offsetParent
|
||||
}
|
||||
el = e;
|
||||
while (el && el.tagName && el.tagName.toLowerCase() != 'body') {
|
||||
x -= el.scrollLeft || 0;
|
||||
y -= el.scrollTop || 0;
|
||||
el = el.parentNode
|
||||
}
|
||||
if (restoreStyle) {
|
||||
es.display = 'none';
|
||||
es.position = oldPosition;
|
||||
es.visibility = oldVisibility
|
||||
}
|
||||
return {
|
||||
x: x,
|
||||
y: y
|
||||
}
|
||||
},
|
||||
getPositionLite: function(el) {
|
||||
var x = 0,
|
||||
y = 0;
|
||||
while (el) {
|
||||
x += el.offsetLeft || 0;
|
||||
y += el.offsetTop || 0;
|
||||
el = el.offsetParent
|
||||
}
|
||||
return {
|
||||
x: x,
|
||||
y: y
|
||||
}
|
||||
},
|
||||
getSize: function(e) {
|
||||
var w = jQuery.css(e, 'width');
|
||||
var h = jQuery.css(e, 'height');
|
||||
var wb = 0;
|
||||
var hb = 0;
|
||||
var es = e.style;
|
||||
if (jQuery(e).css('display') != 'none') {
|
||||
wb = e.offsetWidth;
|
||||
hb = e.offsetHeight
|
||||
} else {
|
||||
oldVisibility = es.visibility;
|
||||
oldPosition = es.position;
|
||||
es.visibility = 'hidden';
|
||||
es.display = 'block';
|
||||
es.position = 'absolute';
|
||||
wb = e.offsetWidth;
|
||||
hb = e.offsetHeight;
|
||||
es.display = 'none';
|
||||
es.position = oldPosition;
|
||||
es.visibility = oldVisibility
|
||||
}
|
||||
return {
|
||||
w: w,
|
||||
h: h,
|
||||
wb: wb,
|
||||
hb: hb
|
||||
}
|
||||
},
|
||||
getSizeLite: function(el) {
|
||||
return {
|
||||
wb: el.offsetWidth || 0,
|
||||
hb: el.offsetHeight || 0
|
||||
}
|
||||
},
|
||||
getClient: function(e) {
|
||||
var h,
|
||||
w,
|
||||
de;
|
||||
if (e) {
|
||||
w = e.clientWidth;
|
||||
h = e.clientHeight
|
||||
} else {
|
||||
de = document.documentElement;
|
||||
w = window.innerWidth || self.innerWidth || (de && de.clientWidth) || document.body.clientWidth;
|
||||
h = window.innerHeight || self.innerHeight || (de && de.clientHeight) || document.body.clientHeight
|
||||
}
|
||||
return {
|
||||
w: w,
|
||||
h: h
|
||||
}
|
||||
},
|
||||
getScroll: function(e) {
|
||||
var t,
|
||||
l,
|
||||
w,
|
||||
h,
|
||||
iw,
|
||||
ih;
|
||||
if (e && e.nodeName.toLowerCase() != 'body') {
|
||||
t = e.scrollTop;
|
||||
l = e.scrollLeft;
|
||||
w = e.scrollWidth;
|
||||
h = e.scrollHeight;
|
||||
iw = 0;
|
||||
ih = 0
|
||||
} else {
|
||||
if (document.documentElement && document.documentElement.scrollTop) {
|
||||
t = document.documentElement.scrollTop;
|
||||
l = document.documentElement.scrollLeft;
|
||||
w = document.documentElement.scrollWidth;
|
||||
h = document.documentElement.scrollHeight
|
||||
} else if (document.body) {
|
||||
t = document.body.scrollTop;
|
||||
l = document.body.scrollLeft;
|
||||
w = document.body.scrollWidth;
|
||||
h = document.body.scrollHeight
|
||||
}
|
||||
iw = self.innerWidth || document.documentElement.clientWidth || document.body.clientWidth || 0;
|
||||
ih = self.innerHeight || document.documentElement.clientHeight || document.body.clientHeight || 0
|
||||
}
|
||||
return {
|
||||
t: t,
|
||||
l: l,
|
||||
w: w,
|
||||
h: h,
|
||||
iw: iw,
|
||||
ih: ih
|
||||
}
|
||||
},
|
||||
getMargins: function(e, toInteger) {
|
||||
var el = jQuery(e);
|
||||
var t = el.css('marginTop') || '';
|
||||
var r = el.css('marginRight') || '';
|
||||
var b = el.css('marginBottom') || '';
|
||||
var l = el.css('marginLeft') || '';
|
||||
if (toInteger) return {
|
||||
t: parseInt(t) || 0,
|
||||
r: parseInt(r) || 0,
|
||||
b: parseInt(b) || 0,
|
||||
l: parseInt(l)
|
||||
};
|
||||
else return {
|
||||
t: t,
|
||||
r: r,
|
||||
b: b,
|
||||
l: l
|
||||
}
|
||||
},
|
||||
getPadding: function(e, toInteger) {
|
||||
var el = jQuery(e);
|
||||
var t = el.css('paddingTop') || '';
|
||||
var r = el.css('paddingRight') || '';
|
||||
var b = el.css('paddingBottom') || '';
|
||||
var l = el.css('paddingLeft') || '';
|
||||
if (toInteger) return {
|
||||
t: parseInt(t) || 0,
|
||||
r: parseInt(r) || 0,
|
||||
b: parseInt(b) || 0,
|
||||
l: parseInt(l)
|
||||
};
|
||||
else return {
|
||||
t: t,
|
||||
r: r,
|
||||
b: b,
|
||||
l: l
|
||||
}
|
||||
},
|
||||
getBorder: function(e, toInteger) {
|
||||
var el = jQuery(e);
|
||||
var t = el.css('borderTopWidth') || '';
|
||||
var r = el.css('borderRightWidth') || '';
|
||||
var b = el.css('borderBottomWidth') || '';
|
||||
var l = el.css('borderLeftWidth') || '';
|
||||
if (toInteger) return {
|
||||
t: parseInt(t) || 0,
|
||||
r: parseInt(r) || 0,
|
||||
b: parseInt(b) || 0,
|
||||
l: parseInt(l) || 0
|
||||
};
|
||||
else return {
|
||||
t: t,
|
||||
r: r,
|
||||
b: b,
|
||||
l: l
|
||||
}
|
||||
},
|
||||
getPointer: function(event) {
|
||||
var x = event.pageX || (event.clientX + (document.documentElement.scrollLeft || document.body.scrollLeft)) || 0;
|
||||
var y = event.pageY || (event.clientY + (document.documentElement.scrollTop || document.body.scrollTop)) || 0;
|
||||
return {
|
||||
x: x,
|
||||
y: y
|
||||
}
|
||||
},
|
||||
traverseDOM: function(nodeEl, func) {
|
||||
func(nodeEl);
|
||||
nodeEl = nodeEl.firstChild;
|
||||
while (nodeEl) {
|
||||
jQuery.iUtil.traverseDOM(nodeEl, func);
|
||||
nodeEl = nodeEl.nextSibling
|
||||
}
|
||||
},
|
||||
purgeEvents: function(nodeEl) {
|
||||
jQuery.iUtil.traverseDOM(nodeEl,
|
||||
function(el) {
|
||||
for (var attr in el) {
|
||||
if (typeof el[attr] === 'function') {
|
||||
el[attr] = null
|
||||
}
|
||||
}
|
||||
})
|
||||
},
|
||||
centerEl: function(el, axis) {
|
||||
var clientScroll = $.iUtil.getScroll();
|
||||
var windowSize = $.iUtil.getSize(el);
|
||||
if (!axis || axis == 'vertically') $(el).css({
|
||||
top: clientScroll.t + ((Math.max(clientScroll.h, clientScroll.ih) - clientScroll.t - windowSize.hb) / 2) + 'px'
|
||||
});
|
||||
if (!axis || axis == 'horizontally') $(el).css({
|
||||
left: clientScroll.l + ((Math.max(clientScroll.w, clientScroll.iw) - clientScroll.l - windowSize.wb) / 2) + 'px'
|
||||
})
|
||||
},
|
||||
fixPNG: function(el, emptyGIF) {
|
||||
var images = $('img[@src*="png"]', el || document),
|
||||
png;
|
||||
images.each(function() {
|
||||
png = this.src;
|
||||
this.src = emptyGIF;
|
||||
this.style.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='" + png + "')"
|
||||
})
|
||||
}
|
||||
}; [].indexOf || (Array.prototype.indexOf = function(v, n) {
|
||||
n = (n == null) ? 0: n;
|
||||
var m = this.length;
|
||||
for (var i = n; i < m; i++) if (this[i] == v) return i;
|
||||
return - 1
|
||||
});
|
||||
jQuery.fxCheckTag = function(e) {
|
||||
if (/^tr$|^td$|^tbody$|^caption$|^thead$|^tfoot$|^col$|^colgroup$|^th$|^body$|^header$|^script$|^frame$|^frameset$|^option$|^optgroup$|^meta$/i.test(e.nodeName)) return false;
|
||||
else return true
|
||||
};
|
||||
jQuery.fx.destroyWrapper = function(e, old) {
|
||||
var c = e.firstChild;
|
||||
var cs = c.style;
|
||||
cs.position = old.position;
|
||||
cs.marginTop = old.margins.t;
|
||||
cs.marginLeft = old.margins.l;
|
||||
cs.marginBottom = old.margins.b;
|
||||
cs.marginRight = old.margins.r;
|
||||
cs.top = old.top + 'px';
|
||||
cs.left = old.left + 'px';
|
||||
e.parentNode.insertBefore(c, e);
|
||||
e.parentNode.removeChild(e)
|
||||
};
|
||||
jQuery.fx.buildWrapper = function(e) {
|
||||
if (!jQuery.fxCheckTag(e)) return false;
|
||||
var t = jQuery(e);
|
||||
var es = e.style;
|
||||
var restoreStyle = false;
|
||||
var oldStyle = {};
|
||||
oldStyle.position = t.css('position');
|
||||
if (t.css('display') == 'none') {
|
||||
oldVisibility = t.css('visibility');
|
||||
es.visibility = 'hidden';
|
||||
es.display = '';
|
||||
restoreStyle = true
|
||||
}
|
||||
oldStyle.sizes = jQuery.iUtil.getSize(e);
|
||||
oldStyle.margins = jQuery.iUtil.getMargins(e);
|
||||
var oldFloat = e.currentStyle ? e.currentStyle.styleFloat: t.css('float');
|
||||
oldStyle.top = parseInt(t.css('top')) || 0;
|
||||
oldStyle.left = parseInt(t.css('left')) || 0;
|
||||
var wid = 'w_' + parseInt(Math.random() * 10000);
|
||||
var wr = document.createElement(/^img$|^br$|^input$|^hr$|^select$|^textarea$|^object$|^iframe$|^button$|^form$|^table$|^ul$|^dl$|^ol$/i.test(e.nodeName) ? 'div': e.nodeName);
|
||||
jQuery.attr(wr, 'id', wid);
|
||||
wr.className = 'fxWrapper';
|
||||
var wrs = wr.style;
|
||||
var top = 0;
|
||||
var left = 0;
|
||||
if (oldStyle.position == 'relative' || oldStyle.position == 'absolute') {
|
||||
top = oldStyle.top;
|
||||
left = oldStyle.left
|
||||
}
|
||||
wrs.display = 'none';
|
||||
wrs.top = top + 'px';
|
||||
wrs.left = left + 'px';
|
||||
wrs.position = oldStyle.position != 'relative' && oldStyle.position != 'absolute' ? 'relative': oldStyle.position;
|
||||
wrs.overflow = 'hidden';
|
||||
wrs.height = oldStyle.sizes.hb + 'px';
|
||||
wrs.width = oldStyle.sizes.wb + 'px';
|
||||
wrs.marginTop = oldStyle.margins.t;
|
||||
wrs.marginRight = oldStyle.margins.r;
|
||||
wrs.marginBottom = oldStyle.margins.b;
|
||||
wrs.marginLeft = oldStyle.margins.l;
|
||||
if (jQuery.browser.msie) {
|
||||
wrs.styleFloat = oldFloat
|
||||
} else {
|
||||
wrs.cssFloat = oldFloat
|
||||
}
|
||||
e.parentNode.insertBefore(wr, e);
|
||||
es.marginTop = '0px';
|
||||
es.marginRight = '0px';
|
||||
es.marginBottom = '0px';
|
||||
es.marginLeft = '0px';
|
||||
es.position = 'absolute';
|
||||
es.listStyle = 'none';
|
||||
es.top = '0px';
|
||||
es.left = '0px';
|
||||
if (restoreStyle) {
|
||||
es.display = 'none';
|
||||
es.visibility = oldVisibility
|
||||
}
|
||||
wr.appendChild(e);
|
||||
wrs.display = 'block';
|
||||
return {
|
||||
oldStyle: oldStyle,
|
||||
wrapper: jQuery(wr)
|
||||
}
|
||||
};
|
||||
jQuery.fx.namedColors = {
|
||||
aqua: [0, 255, 255],
|
||||
azure: [240, 255, 255],
|
||||
beige: [245, 245, 220],
|
||||
black: [0, 0, 0],
|
||||
blue: [0, 0, 255],
|
||||
brown: [165, 42, 42],
|
||||
cyan: [0, 255, 255],
|
||||
darkblue: [0, 0, 139],
|
||||
darkcyan: [0, 139, 139],
|
||||
darkgrey: [169, 169, 169],
|
||||
darkgreen: [0, 100, 0],
|
||||
darkkhaki: [189, 183, 107],
|
||||
darkmagenta: [139, 0, 139],
|
||||
darkolivegreen: [85, 107, 47],
|
||||
darkorange: [255, 140, 0],
|
||||
darkorchid: [153, 50, 204],
|
||||
darkred: [139, 0, 0],
|
||||
darksalmon: [233, 150, 122],
|
||||
darkviolet: [148, 0, 211],
|
||||
fuchsia: [255, 0, 255],
|
||||
gold: [255, 215, 0],
|
||||
green: [0, 128, 0],
|
||||
indigo: [75, 0, 130],
|
||||
khaki: [240, 230, 140],
|
||||
lightblue: [173, 216, 230],
|
||||
lightcyan: [224, 255, 255],
|
||||
lightgreen: [144, 238, 144],
|
||||
lightgrey: [211, 211, 211],
|
||||
lightpink: [255, 182, 193],
|
||||
lightyellow: [255, 255, 224],
|
||||
lime: [0, 255, 0],
|
||||
magenta: [255, 0, 255],
|
||||
maroon: [128, 0, 0],
|
||||
navy: [0, 0, 128],
|
||||
olive: [128, 128, 0],
|
||||
orange: [255, 165, 0],
|
||||
pink: [255, 192, 203],
|
||||
purple: [128, 0, 128],
|
||||
red: [255, 0, 0],
|
||||
silver: [192, 192, 192],
|
||||
white: [255, 255, 255],
|
||||
yellow: [255, 255, 0]
|
||||
};
|
||||
jQuery.fx.parseColor = function(color, notColor) {
|
||||
if (jQuery.fx.namedColors[color]) return {
|
||||
r: jQuery.fx.namedColors[color][0],
|
||||
g: jQuery.fx.namedColors[color][1],
|
||||
b: jQuery.fx.namedColors[color][2]
|
||||
};
|
||||
else if (result = /^rgb\(\s*([0-9]{1,3})\s*,\s*([0-9]{1,3})\s*,\s*([0-9]{1,3})\s*\)$/.exec(color)) return {
|
||||
r: parseInt(result[1]),
|
||||
g: parseInt(result[2]),
|
||||
b: parseInt(result[3])
|
||||
};
|
||||
else if (result = /rgb\(\s*([0-9]+(?:\.[0-9]+)?)\%\s*,\s*([0-9]+(?:\.[0-9]+)?)\%\s*,\s*([0-9]+(?:\.[0-9]+)?)\%\s*\)$/.exec(color)) return {
|
||||
r: parseFloat(result[1]) * 2.55,
|
||||
g: parseFloat(result[2]) * 2.55,
|
||||
b: parseFloat(result[3]) * 2.55
|
||||
};
|
||||
else if (result = /^#([a-fA-F0-9])([a-fA-F0-9])([a-fA-F0-9])$/.exec(color)) return {
|
||||
r: parseInt("0x" + result[1] + result[1]),
|
||||
g: parseInt("0x" + result[2] + result[2]),
|
||||
b: parseInt("0x" + result[3] + result[3])
|
||||
};
|
||||
else if (result = /^#([a-fA-F0-9]{2})([a-fA-F0-9]{2})([a-fA-F0-9]{2})$/.exec(color)) return {
|
||||
r: parseInt("0x" + result[1]),
|
||||
g: parseInt("0x" + result[2]),
|
||||
b: parseInt("0x" + result[3])
|
||||
};
|
||||
else return notColor == true ? false: {
|
||||
r: 255,
|
||||
g: 255,
|
||||
b: 255
|
||||
}
|
||||
};
|
||||
jQuery.fx.cssProps = {
|
||||
borderBottomWidth: 1,
|
||||
borderLeftWidth: 1,
|
||||
borderRightWidth: 1,
|
||||
borderTopWidth: 1,
|
||||
bottom: 1,
|
||||
fontSize: 1,
|
||||
height: 1,
|
||||
left: 1,
|
||||
letterSpacing: 1,
|
||||
lineHeight: 1,
|
||||
marginBottom: 1,
|
||||
marginLeft: 1,
|
||||
marginRight: 1,
|
||||
marginTop: 1,
|
||||
maxHeight: 1,
|
||||
maxWidth: 1,
|
||||
minHeight: 1,
|
||||
minWidth: 1,
|
||||
opacity: 1,
|
||||
outlineOffset: 1,
|
||||
outlineWidth: 1,
|
||||
paddingBottom: 1,
|
||||
paddingLeft: 1,
|
||||
paddingRight: 1,
|
||||
paddingTop: 1,
|
||||
right: 1,
|
||||
textIndent: 1,
|
||||
top: 1,
|
||||
width: 1,
|
||||
zIndex: 1
|
||||
};
|
||||
jQuery.fx.colorCssProps = {
|
||||
backgroundColor: 1,
|
||||
borderBottomColor: 1,
|
||||
borderLeftColor: 1,
|
||||
borderRightColor: 1,
|
||||
borderTopColor: 1,
|
||||
color: 1,
|
||||
outlineColor: 1
|
||||
};
|
||||
jQuery.fx.cssSides = ['Top', 'Right', 'Bottom', 'Left'];
|
||||
jQuery.fx.cssSidesEnd = {
|
||||
'borderWidth': ['border', 'Width'],
|
||||
'borderColor': ['border', 'Color'],
|
||||
'margin': ['margin', ''],
|
||||
'padding': ['padding', '']
|
||||
};
|
||||
jQuery.fn.extend({
|
||||
animate: function(prop, speed, easing, callback) {
|
||||
return this.queue(function() {
|
||||
var opt = jQuery.speed(speed, easing, callback);
|
||||
var e = new jQuery.fxe(this, opt, prop)
|
||||
})
|
||||
},
|
||||
pause: function(speed, callback) {
|
||||
return this.queue(function() {
|
||||
var opt = jQuery.speed(speed, callback);
|
||||
var e = new jQuery.pause(this, opt)
|
||||
})
|
||||
},
|
||||
stop: function(step) {
|
||||
return this.each(function() {
|
||||
if (this.animationHandler) jQuery.stopAnim(this, step)
|
||||
})
|
||||
},
|
||||
stopAll: function(step) {
|
||||
return this.each(function() {
|
||||
if (this.animationHandler) jQuery.stopAnim(this, step);
|
||||
if (this.queue && this.queue['fx']) this.queue.fx = []
|
||||
})
|
||||
}
|
||||
});
|
||||
jQuery.extend({
|
||||
pause: function(elem, options) {
|
||||
var z = this,
|
||||
values;
|
||||
z.step = function() {
|
||||
if (jQuery.isFunction(options.complete)) options.complete.apply(elem)
|
||||
};
|
||||
z.timer = setInterval(function() {
|
||||
z.step()
|
||||
},
|
||||
options.duration);
|
||||
elem.animationHandler = z
|
||||
},
|
||||
easing: {
|
||||
linear: function(p, n, firstNum, delta, duration) {
|
||||
return (( - Math.cos(p * Math.PI) / 2) + 0.5) * delta + firstNum
|
||||
}
|
||||
},
|
||||
fxe: function(elem, options, prop) {
|
||||
var z = this,
|
||||
values;
|
||||
var y = elem.style;
|
||||
var oldOverflow = jQuery.css(elem, "overflow");
|
||||
var oldDisplay = jQuery.css(elem, "display");
|
||||
var props = {};
|
||||
z.startTime = (new Date()).getTime();
|
||||
options.easing = options.easing && jQuery.easing[options.easing] ? options.easing: 'linear';
|
||||
z.getValues = function(tp, vp) {
|
||||
if (jQuery.fx.cssProps[tp]) {
|
||||
if (vp == 'show' || vp == 'hide' || vp == 'toggle') {
|
||||
if (!elem.orig) elem.orig = {};
|
||||
var r = parseFloat(jQuery.css(elem, tp));
|
||||
elem.orig[tp] = r && r > -10000 ? r: (parseFloat(jQuery.css(elem, tp)) || 0);
|
||||
vp = vp == 'toggle' ? (oldDisplay == 'none' ? 'show': 'hide') : vp;
|
||||
options[vp] = true;
|
||||
props[tp] = vp == 'show' ? [0, elem.orig[tp]] : [elem.orig[tp], 0];
|
||||
if (tp != 'opacity') y[tp] = props[tp][0] + (tp != 'zIndex' && tp != 'fontWeight' ? 'px': '');
|
||||
else jQuery.attr(y, "opacity", props[tp][0])
|
||||
} else {
|
||||
props[tp] = [parseFloat(jQuery.css(elem, tp)), parseFloat(vp) || 0]
|
||||
}
|
||||
} else if (jQuery.fx.colorCssProps[tp]) props[tp] = [jQuery.fx.parseColor(jQuery.css(elem, tp)), jQuery.fx.parseColor(vp)];
|
||||
else if (/^margin$|padding$|border$|borderColor$|borderWidth$/i.test(tp)) {
|
||||
var m = vp.replace(/\s+/g, ' ').replace(/rgb\s*\(\s*/g, 'rgb(').replace(/\s*,\s*/g, ',').replace(/\s*\)/g, ')').match(/([^\s]+)/g);
|
||||
switch (tp) {
|
||||
case 'margin':
|
||||
case 'padding':
|
||||
case 'borderWidth':
|
||||
case 'borderColor':
|
||||
m[3] = m[3] || m[1] || m[0];
|
||||
m[2] = m[2] || m[0];
|
||||
m[1] = m[1] || m[0];
|
||||
for (var i = 0; i < jQuery.fx.cssSides.length; i++) {
|
||||
var nmp = jQuery.fx.cssSidesEnd[tp][0] + jQuery.fx.cssSides[i] + jQuery.fx.cssSidesEnd[tp][1];
|
||||
props[nmp] = tp == 'borderColor' ? [jQuery.fx.parseColor(jQuery.css(elem, nmp)), jQuery.fx.parseColor(m[i])] : [parseFloat(jQuery.css(elem, nmp)), parseFloat(m[i])]
|
||||
}
|
||||
break;
|
||||
case 'border':
|
||||
for (var i = 0; i < m.length; i++) {
|
||||
var floatVal = parseFloat(m[i]);
|
||||
var sideEnd = !isNaN(floatVal) ? 'Width': (!/transparent|none|hidden|dotted|dashed|solid|double|groove|ridge|inset|outset/i.test(m[i]) ? 'Color': false);
|
||||
if (sideEnd) {
|
||||
for (var j = 0; j < jQuery.fx.cssSides.length; j++) {
|
||||
nmp = 'border' + jQuery.fx.cssSides[j] + sideEnd;
|
||||
props[nmp] = sideEnd == 'Color' ? [jQuery.fx.parseColor(jQuery.css(elem, nmp)), jQuery.fx.parseColor(m[i])] : [parseFloat(jQuery.css(elem, nmp)), floatVal]
|
||||
}
|
||||
} else {
|
||||
y['borderStyle'] = m[i]
|
||||
}
|
||||
}
|
||||
break
|
||||
}
|
||||
} else {
|
||||
y[tp] = vp
|
||||
}
|
||||
return false
|
||||
};
|
||||
for (p in prop) {
|
||||
if (p == 'style') {
|
||||
var newStyles = jQuery.parseStyle(prop[p]);
|
||||
for (np in newStyles) {
|
||||
this.getValues(np, newStyles[np])
|
||||
}
|
||||
} else if (p == 'className') {
|
||||
if (document.styleSheets) for (var i = 0; i < document.styleSheets.length; i++) {
|
||||
var cssRules = document.styleSheets[i].cssRules || document.styleSheets[i].rules || null;
|
||||
if (cssRules) {
|
||||
for (var j = 0; j < cssRules.length; j++) {
|
||||
if (cssRules[j].selectorText == '.' + prop[p]) {
|
||||
var rule = new RegExp('\.' + prop[p] + ' {');
|
||||
var styles = cssRules[j].style.cssText;
|
||||
var newStyles = jQuery.parseStyle(styles.replace(rule, '').replace(/}/g, ''));
|
||||
for (np in newStyles) {
|
||||
this.getValues(np, newStyles[np])
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
} else {
|
||||
this.getValues(p, prop[p])
|
||||
}
|
||||
}
|
||||
y.display = oldDisplay == 'none' ? 'block': oldDisplay;
|
||||
y.overflow = 'hidden';
|
||||
z.step = function() {
|
||||
var t = (new Date()).getTime();
|
||||
if (t > options.duration + z.startTime) {
|
||||
clearInterval(z.timer);
|
||||
z.timer = null;
|
||||
for (p in props) {
|
||||
if (p == "opacity") jQuery.attr(y, "opacity", props[p][1]);
|
||||
else if (typeof props[p][1] == 'object') y[p] = 'rgb(' + props[p][1].r + ',' + props[p][1].g + ',' + props[p][1].b + ')';
|
||||
else y[p] = props[p][1] + (p != 'zIndex' && p != 'fontWeight' ? 'px': '')
|
||||
}
|
||||
if (options.hide || options.show) for (var p in elem.orig) if (p == "opacity") jQuery.attr(y, p, elem.orig[p]);
|
||||
else y[p] = "";
|
||||
y.display = options.hide ? 'none': (oldDisplay != 'none' ? oldDisplay: 'block');
|
||||
y.overflow = oldOverflow;
|
||||
elem.animationHandler = null;
|
||||
if (jQuery.isFunction(options.complete)) options.complete.apply(elem)
|
||||
} else {
|
||||
var n = t - this.startTime;
|
||||
var pr = n / options.duration;
|
||||
for (p in props) {
|
||||
if (typeof props[p][1] == 'object') {
|
||||
y[p] = 'rgb(' + parseInt(jQuery.easing[options.easing](pr, n, props[p][0].r, (props[p][1].r - props[p][0].r), options.duration)) + ',' + parseInt(jQuery.easing[options.easing](pr, n, props[p][0].g, (props[p][1].g - props[p][0].g), options.duration)) + ',' + parseInt(jQuery.easing[options.easing](pr, n, props[p][0].b, (props[p][1].b - props[p][0].b), options.duration)) + ')'
|
||||
} else {
|
||||
var pValue = jQuery.easing[options.easing](pr, n, props[p][0], (props[p][1] - props[p][0]), options.duration);
|
||||
if (p == "opacity") jQuery.attr(y, "opacity", pValue);
|
||||
else y[p] = pValue + (p != 'zIndex' && p != 'fontWeight' ? 'px': '')
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
z.timer = setInterval(function() {
|
||||
z.step()
|
||||
},
|
||||
13);
|
||||
elem.animationHandler = z
|
||||
},
|
||||
stopAnim: function(elem, step) {
|
||||
if (step) elem.animationHandler.startTime -= 100000000;
|
||||
else {
|
||||
window.clearInterval(elem.animationHandler.timer);
|
||||
elem.animationHandler = null;
|
||||
jQuery.dequeue(elem, "fx")
|
||||
}
|
||||
}
|
||||
});
|
||||
jQuery.parseStyle = function(styles) {
|
||||
var newStyles = {};
|
||||
if (typeof styles == 'string') {
|
||||
styles = styles.toLowerCase().split(';');
|
||||
for (var i = 0; i < styles.length; i++) {
|
||||
rule = styles[i].split(':');
|
||||
if (rule.length == 2) {
|
||||
newStyles[jQuery.trim(rule[0].replace(/\-(\w)/g,
|
||||
function(m, c) {
|
||||
return c.toUpperCase()
|
||||
}))] = jQuery.trim(rule[1])
|
||||
}
|
||||
}
|
||||
}
|
||||
return newStyles
|
||||
};
|
||||
jQuery.iFisheye = {
|
||||
build: function(options) {
|
||||
return this.each(function() {
|
||||
var el = this;
|
||||
el.fisheyeCfg = {
|
||||
items: jQuery(options.items, this),
|
||||
container: jQuery(options.container, this),
|
||||
pos: jQuery.iUtil.getPosition(this),
|
||||
itemWidth: options.itemWidth,
|
||||
itemsText: options.itemsText,
|
||||
proximity: options.proximity,
|
||||
valign: options.valign,
|
||||
halign: options.halign,
|
||||
maxWidth: options.maxWidth
|
||||
};
|
||||
jQuery.iFisheye.positionContainer(el, 0);
|
||||
jQuery(window).bind('resize',
|
||||
function() {
|
||||
el.fisheyeCfg.pos = jQuery.iUtil.getPosition(el);
|
||||
jQuery.iFisheye.positionContainer(el, 0);
|
||||
jQuery.iFisheye.positionItems(el)
|
||||
});
|
||||
jQuery.iFisheye.positionItems(el);
|
||||
el.fisheyeCfg.items.bind('mouseover',
|
||||
function() {
|
||||
jQuery(el.fisheyeCfg.itemsText, this).get(0).style.display = 'block'
|
||||
}).bind('mouseout',
|
||||
function() {
|
||||
jQuery(el.fisheyeCfg.itemsText, this).get(0).style.display = 'none'
|
||||
});
|
||||
jQuery(document).bind('mousemove',
|
||||
function(e) {
|
||||
var pointer = jQuery.iUtil.getPointer(e);
|
||||
var toAdd = 0;
|
||||
if (el.fisheyeCfg.halign && el.fisheyeCfg.halign == 'center') var posx = pointer.x - el.fisheyeCfg.pos.x - (el.offsetWidth - el.fisheyeCfg.itemWidth * el.fisheyeCfg.items.size()) / 2 - el.fisheyeCfg.itemWidth / 2;
|
||||
else if (el.fisheyeCfg.halign && el.fisheyeCfg.halign == 'right') var posx = pointer.x - el.fisheyeCfg.pos.x - el.offsetWidth + el.fisheyeCfg.itemWidth * el.fisheyeCfg.items.size();
|
||||
else var posx = pointer.x - el.fisheyeCfg.pos.x;
|
||||
var posy = Math.pow(pointer.y - el.fisheyeCfg.pos.y - el.offsetHeight / 2, 2);
|
||||
el.fisheyeCfg.items.each(function(nr) {
|
||||
distance = Math.sqrt(Math.pow(posx - nr * el.fisheyeCfg.itemWidth, 2) + posy);
|
||||
distance -= el.fisheyeCfg.itemWidth / 2;
|
||||
distance = distance < 0 ? 0: distance;
|
||||
distance = distance > el.fisheyeCfg.proximity ? el.fisheyeCfg.proximity: distance;
|
||||
distance = el.fisheyeCfg.proximity - distance;
|
||||
extraWidth = el.fisheyeCfg.maxWidth * distance / el.fisheyeCfg.proximity;
|
||||
this.style.width = el.fisheyeCfg.itemWidth + extraWidth + 'px';
|
||||
this.style.left = el.fisheyeCfg.itemWidth * nr + toAdd + 'px';
|
||||
toAdd += extraWidth
|
||||
});
|
||||
jQuery.iFisheye.positionContainer(el, toAdd)
|
||||
})
|
||||
})
|
||||
},
|
||||
positionContainer: function(el, toAdd) {
|
||||
if (el.fisheyeCfg.halign) if (el.fisheyeCfg.halign == 'center') el.fisheyeCfg.container.get(0).style.left = (el.offsetWidth - el.fisheyeCfg.itemWidth * el.fisheyeCfg.items.size()) / 2 - toAdd / 2 + 'px';
|
||||
else if (el.fisheyeCfg.halign == 'left') el.fisheyeCfg.container.get(0).style.left = -toAdd / el.fisheyeCfg.items.size() + 'px';
|
||||
else if (el.fisheyeCfg.halign == 'right') el.fisheyeCfg.container.get(0).style.left = (el.offsetWidth - el.fisheyeCfg.itemWidth * el.fisheyeCfg.items.size()) - toAdd / 2 + 'px';
|
||||
el.fisheyeCfg.container.get(0).style.width = el.fisheyeCfg.itemWidth * el.fisheyeCfg.items.size() + toAdd + 'px'
|
||||
},
|
||||
positionItems: function(el) {
|
||||
el.fisheyeCfg.items.each(function(nr) {
|
||||
this.style.width = el.fisheyeCfg.itemWidth + 'px';
|
||||
this.style.left = el.fisheyeCfg.itemWidth * nr + 'px'
|
||||
})
|
||||
}
|
||||
};
|
||||
jQuery.fn.Fisheye = jQuery.iFisheye.build;
|
||||
60
js/mac.js
|
|
@ -2,7 +2,7 @@
|
|||
* Created by Yuri2 on 2017/7/10.
|
||||
*/
|
||||
window.Win10 = {
|
||||
_version:'v1.1.2.3',
|
||||
_version:'v1.1.2.4',
|
||||
_debug:true,
|
||||
_bgs:{
|
||||
main:'',
|
||||
|
|
@ -177,6 +177,7 @@ window.Win10 = {
|
|||
btn.addClass('active');
|
||||
}
|
||||
},
|
||||
//渲染右键
|
||||
_renderContextMenu:function (x,y,menu,trigger) {
|
||||
this._removeContextMenu();
|
||||
if(menu===true){return;}
|
||||
|
|
@ -360,7 +361,9 @@ window.Win10 = {
|
|||
zIndex:99999999999
|
||||
}, function (value, i) {
|
||||
layer.close(i);
|
||||
iframe.attr('src', value);
|
||||
layer.msg(Win10.lang('请稍候...','Hold on please...'),{time:1500},function () {
|
||||
iframe.attr('src', value);
|
||||
});
|
||||
});
|
||||
});
|
||||
$(document).on('mousedown','.win10-open-iframe',function () {
|
||||
|
|
@ -378,7 +381,9 @@ window.Win10 = {
|
|||
$('#win10-menu .list .item.has-sub-up').toggleClass('has-sub-down').toggleClass('has-sub-up');
|
||||
$("#win10-menu .list .sub-item").slideUp();
|
||||
}
|
||||
e.toggleClass('has-sub-down').toggleClass('has-sub-up');
|
||||
if(e.next().hasClass('sub-item')){
|
||||
e.toggleClass('has-sub-down').toggleClass('has-sub-up');
|
||||
}
|
||||
while (e.next().hasClass('sub-item')){
|
||||
e.next().slideToggle();
|
||||
e=e.next();
|
||||
|
|
@ -404,13 +409,6 @@ window.Win10 = {
|
|||
setInterval(function () {
|
||||
//重新写mac时间
|
||||
var myDate = new Date();
|
||||
/* var year=myDate.getFullYear();
|
||||
var week=myDate.getDay();
|
||||
var month=myDate.getMonth()+1;
|
||||
var date=myDate.getDate();
|
||||
var hours=myDate.getHours();
|
||||
var mins=myDate.getMinutes();if (mins<10){mins='0'+mins} */
|
||||
//$("#win10_btn_time").html(year+'/'+month+'/'+date+hours+':'+mins);
|
||||
var week = new Array("星期日", "星期一", "星期二", "星期三", "星期四", "星期五", "星期六")[myDate.getDay()];
|
||||
var hour=myDate.getHours();
|
||||
var mins=myDate.getMinutes();if (mins<10){mins='0'+mins}
|
||||
|
|
@ -430,8 +428,13 @@ window.Win10 = {
|
|||
$("#win10_btn_time").html(week+hours+':'+mins);
|
||||
},1000);
|
||||
//离开前警告
|
||||
document.body.onbeforeunload = function(){
|
||||
window.event.returnValue = Win10.lang( '系统可能不会保存您所做的更改','The system may not save the changes you have made.');
|
||||
document.body.onbeforeunload = function(event){
|
||||
var rel = Win10.lang( '系统可能不会保存您所做的更改','The system may not save the changes you have made.');
|
||||
if(!window.event){
|
||||
event.returnValue=rel;
|
||||
}else{
|
||||
window.event.returnValue=rel;
|
||||
}
|
||||
};
|
||||
Win10.buildList();//预处理左侧菜单
|
||||
Win10._startAnimate();//动画处理
|
||||
|
|
@ -443,7 +446,7 @@ window.Win10 = {
|
|||
$(window).resize(function() {
|
||||
Win10.renderShortcuts();
|
||||
Win10._checkBgUrls();
|
||||
Win10._fixWindowsHeightAndWidth();
|
||||
if(!Win10.isSmallScreen()) Win10._fixWindowsHeightAndWidth(); //2017年11月14日修改,加入了if条件
|
||||
Win10.renderDocks();
|
||||
});
|
||||
//细节
|
||||
|
|
@ -460,8 +463,9 @@ window.Win10 = {
|
|||
console.log(Win10.lang('本页由Win10-UI强力驱动\n更多信息:http://win10ui.yuri2.cn \nWin10-UI,轻松打造别具一格的后台界面 ','The page is strongly driven by Win10-UI.\nFor more info: http://win10ui.yuri2.cn.\n Win10-UI, easy to create a unique background interface.'))
|
||||
},2000);
|
||||
//点击清空右键菜单
|
||||
$(document).click(function () {
|
||||
Win10._removeContextMenu();
|
||||
$(document).click(function (event) {
|
||||
if(!event.button)
|
||||
Win10._removeContextMenu();
|
||||
});
|
||||
//禁用右键的右键
|
||||
$(document).on('contextmenu','.win10-context-menu',function (e) {
|
||||
|
|
@ -602,18 +606,33 @@ window.Win10 = {
|
|||
}
|
||||
});
|
||||
},
|
||||
//渲染DOCK
|
||||
renderDocks:function () {
|
||||
var cell_width=74;
|
||||
$('#dock').Fisheye(
|
||||
{
|
||||
maxWidth: 70,
|
||||
items: 'a',
|
||||
itemsText: 'span',
|
||||
container: '.dock-container',
|
||||
itemWidth: 50,
|
||||
proximity: 80,
|
||||
alignment : 'left',
|
||||
valign: 'bottom',
|
||||
halign : 'center'
|
||||
}
|
||||
)
|
||||
|
||||
var cell_width=50;
|
||||
var width=document.body.clientWidth ;
|
||||
var docks=$("#footer .dock li");
|
||||
var docks=$(".dock .dock-container a");
|
||||
var max_num=parseInt(width/cell_width)-1;
|
||||
for (var i = 0; i < docks.length; i++) {
|
||||
if (i>max_num) {
|
||||
docks.eq(i).css('display','none');
|
||||
docks.eq(i).hide();
|
||||
}else{
|
||||
docks.eq(i).css('display','list-item');
|
||||
docks.eq(i).show();
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
commandCenterToggle: function () {
|
||||
if($("#win10_command_center").hasClass('hidden_right')){
|
||||
|
|
@ -763,7 +782,6 @@ window.Win10 = {
|
|||
layero_opened.css('z-index',Win10._countTask+813);
|
||||
Win10._settop(layero_opened);
|
||||
//重新定义菜单布局
|
||||
//layero_opened.find('.layui-layer-setwin').prepend('<a class="win10-btn-change-url" index="' + index + '" href="#"><span class="fa fa-chain"></span></a><a class="win10-btn-refresh" index="' + index + '" href="#"><span class="fa fa-refresh"></span></a>');
|
||||
layero_opened.find('.layui-layer-setwin').prepend('<a class="win10-btn-refresh" index="' + index + '" href="#"></a>');
|
||||
layero_opened.find('.layui-layer-setwin .layui-layer-max').click(function () {
|
||||
setTimeout(function () {
|
||||
|
|
|
|||
22
js/win10.js
|
|
@ -2,7 +2,7 @@
|
|||
* Created by Yuri2 on 2017/7/10.
|
||||
*/
|
||||
window.Win10 = {
|
||||
_version:'v1.1.2.3',
|
||||
_version:'v1.1.2.4',
|
||||
_debug:true,
|
||||
_bgs:{
|
||||
main:'',
|
||||
|
|
@ -380,7 +380,9 @@ window.Win10 = {
|
|||
$('#win10-menu .list .item.has-sub-up').toggleClass('has-sub-down').toggleClass('has-sub-up');
|
||||
$("#win10-menu .list .sub-item").slideUp();
|
||||
}
|
||||
e.toggleClass('has-sub-down').toggleClass('has-sub-up');
|
||||
if(e.next().hasClass('sub-item')){
|
||||
e.toggleClass('has-sub-down').toggleClass('has-sub-up');
|
||||
}
|
||||
while (e.next().hasClass('sub-item')){
|
||||
e.next().slideToggle();
|
||||
e=e.next();
|
||||
|
|
@ -413,8 +415,13 @@ window.Win10 = {
|
|||
$("#win10_btn_time").html(hours+':'+mins+'<br/>'+year+'/'+month+'/'+date);
|
||||
},1000);
|
||||
//离开前警告
|
||||
document.body.onbeforeunload = function(){
|
||||
window.event.returnValue = Win10.lang( '系统可能不会保存您所做的更改','The system may not save the changes you have made.');
|
||||
document.body.onbeforeunload = function(event){
|
||||
var rel = Win10.lang( '系统可能不会保存您所做的更改','The system may not save the changes you have made.');
|
||||
if(!window.event){
|
||||
event.returnValue=rel;
|
||||
}else{
|
||||
window.event.returnValue=rel;
|
||||
}
|
||||
};
|
||||
Win10.buildList();//预处理左侧菜单
|
||||
Win10._startAnimate();//动画处理
|
||||
|
|
@ -426,7 +433,7 @@ window.Win10 = {
|
|||
$(window).resize(function() {
|
||||
Win10.renderShortcuts();
|
||||
Win10._checkBgUrls();
|
||||
Win10._fixWindowsHeightAndWidth();
|
||||
if(!Win10.isSmallScreen()) Win10._fixWindowsHeightAndWidth(); //2017年11月14日修改,加入了if条件
|
||||
});
|
||||
//细节
|
||||
$(document).on('focus',".win10-layer-open-browser textarea",function () {
|
||||
|
|
@ -442,8 +449,9 @@ window.Win10 = {
|
|||
console.log(Win10.lang('本页由Win10-UI强力驱动\n更多信息:http://win10ui.yuri2.cn \nWin10-UI,轻松打造别具一格的后台界面 ','The page is strongly driven by Win10-UI.\nFor more info: http://win10ui.yuri2.cn.\n Win10-UI, easy to create a unique background interface.'))
|
||||
},2000);
|
||||
//点击清空右键菜单
|
||||
$(document).click(function () {
|
||||
Win10._removeContextMenu();
|
||||
$(document).click(function (event) {
|
||||
if(!event.button)
|
||||
Win10._removeContextMenu();
|
||||
});
|
||||
//禁用右键的右键
|
||||
$(document).on('contextmenu','.win10-context-menu',function (e) {
|
||||
|
|
|
|||
|
|
@ -0,0 +1,24 @@
|
|||
/**
|
||||
* 背景图片切换
|
||||
* 创意:宝通
|
||||
* 润色:Yuri2
|
||||
* */
|
||||
|
||||
使用说明,将theme_switcher.html 作为子页
|
||||
比如放在桌面图标或者开始菜单中
|
||||
|
||||
|
||||
桌面图标的例子:
|
||||
<div class="shortcut win10-open-window" data-url="./plugins/theme_switcher/theme_switcher.html">
|
||||
<i class="icon fa fa-fw fa-picture-o blue" ></i>
|
||||
<div class="title">切换壁纸</div>
|
||||
</div>
|
||||
|
||||
|
||||
目录结构
|
||||
|
||||
win10-ui
|
||||
-plugins
|
||||
-theme_switcher
|
||||
-css,js,html.....
|
||||
|
||||
|
After Width: | Height: | Size: 221 KiB |
|
After Width: | Height: | Size: 189 KiB |
|
After Width: | Height: | Size: 8.2 KiB |
|
After Width: | Height: | Size: 844 KiB |
|
After Width: | Height: | Size: 9.3 KiB |
|
After Width: | Height: | Size: 218 KiB |
|
After Width: | Height: | Size: 17 KiB |
|
After Width: | Height: | Size: 320 KiB |
|
After Width: | Height: | Size: 20 KiB |
|
After Width: | Height: | Size: 330 KiB |
|
After Width: | Height: | Size: 20 KiB |
|
After Width: | Height: | Size: 104 KiB |
|
After Width: | Height: | Size: 3.8 KiB |
|
After Width: | Height: | Size: 434 KiB |
|
After Width: | Height: | Size: 107 KiB |
|
After Width: | Height: | Size: 9.1 KiB |
|
After Width: | Height: | Size: 220 KiB |
|
After Width: | Height: | Size: 4.6 KiB |
|
After Width: | Height: | Size: 473 KiB |
|
After Width: | Height: | Size: 17 KiB |
|
After Width: | Height: | Size: 218 KiB |
|
After Width: | Height: | Size: 12 KiB |
|
After Width: | Height: | Size: 174 KiB |
|
After Width: | Height: | Size: 24 KiB |
|
After Width: | Height: | Size: 339 KiB |
|
After Width: | Height: | Size: 19 KiB |
|
After Width: | Height: | Size: 1.8 MiB |
|
After Width: | Height: | Size: 21 KiB |
|
After Width: | Height: | Size: 275 KiB |
|
After Width: | Height: | Size: 16 KiB |
|
After Width: | Height: | Size: 8.7 KiB |
|
|
@ -0,0 +1,96 @@
|
|||
/*themesetting*/
|
||||
#theme_body {
|
||||
|
||||
}
|
||||
|
||||
.theme_area {
|
||||
z-index: 999;
|
||||
padding: 10px 0 0 10px;
|
||||
}
|
||||
|
||||
.theme_area a {
|
||||
color: #333;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
div.wallpaper_settingButton, a.theme_setting, div.theme_upload {
|
||||
display: inline;
|
||||
float: left;
|
||||
margin: 5px 8px 5px 8px;
|
||||
width: 180px;
|
||||
height: 140px;
|
||||
cursor: pointer;
|
||||
-moz-border-radius: 5px;
|
||||
-khtml-border-radius: 5px;
|
||||
-webkit-border-radius: 5px;
|
||||
border-radius: 5px
|
||||
}
|
||||
|
||||
a.theme_setting {
|
||||
background: #cbe7fc;
|
||||
transition: all 0.5s;
|
||||
}
|
||||
|
||||
a.theme_setting:hover {
|
||||
background: #75c1f9
|
||||
}
|
||||
|
||||
div.themeSetting_hover {
|
||||
background: #75c1f9
|
||||
}
|
||||
|
||||
div.theme_select, a.theme_select {
|
||||
background: #75c1f9
|
||||
}
|
||||
|
||||
.theme_icon {
|
||||
margin: 5px auto;
|
||||
padding-top: 3px;
|
||||
width: 140px;
|
||||
height: 100px;
|
||||
-moz-border-radius: 5px;
|
||||
-khtml-border-radius: 5px;
|
||||
-webkit-border-radius: 5px;
|
||||
border-radius: 5px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.theme_icon img{
|
||||
width: 140px;
|
||||
height: 100px;
|
||||
}
|
||||
|
||||
.theme_text {
|
||||
margin: 5px 0 0 0;
|
||||
text-align: center;
|
||||
font-size: 12px;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.theme_text a {
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.theme_text a:link {
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
div.theme_upload {
|
||||
background: #e9e9e9;
|
||||
transition: all 0.5s;
|
||||
}
|
||||
|
||||
div.theme_upload:hover{
|
||||
background: #75c1f9
|
||||
}
|
||||
|
||||
.clear {
|
||||
clear: both;
|
||||
}
|
||||
|
||||
.h10 {
|
||||
clear: both;
|
||||
height: 10px;
|
||||
}
|
||||
|
||||
/*end*/
|
||||
|
|
@ -0,0 +1,30 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<title>主题切换</title>
|
||||
<link href="theme_switcher.css" rel="stylesheet">
|
||||
<script type="text/javascript" src="../../js/jquery-2.2.4.min.js"></script>
|
||||
<script type="text/javascript" src="../../js/win10.child.js"></script>
|
||||
<script type="text/javascript" src="./theme_switcher.js"></script>
|
||||
</head>
|
||||
<body>
|
||||
<!--主题设置-->
|
||||
<div id="theme_body">
|
||||
<div id="theme_area" class="theme_area">
|
||||
<!--主题图片-->
|
||||
<div id="btn-upload" class="theme_upload">
|
||||
<div class="theme_icon" style="background-image: url(./bg/uploadbg.png);background-size:100% 100%;">
|
||||
<form action="#" method="post" enctype="multipart/form-data">
|
||||
<input style="opacity: 0;display: block;width:100%;height:100px;" type="file">
|
||||
<input type="submit" class="theme_text" value="自定义上传">
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="h10"></div>
|
||||
</div>
|
||||
<div class="clear"></div>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,104 @@
|
|||
|
||||
$(function () {
|
||||
|
||||
//此处预定义了背景数据,其实可以用ajax获取
|
||||
var themes = [
|
||||
{
|
||||
"pic": "./plugins/theme_switcher/bg/bg1.jpg",
|
||||
"thumb": "./bg/bg1_small.jpg",
|
||||
"title": "win10"
|
||||
},
|
||||
{
|
||||
"pic": "./plugins/theme_switcher/bg/bg2.jpg",
|
||||
"thumb": "./bg/bg2_small.jpg",
|
||||
"title": "梦幻光影"
|
||||
},
|
||||
{
|
||||
"pic": "./plugins/theme_switcher/bg/bg3.jpg",
|
||||
"thumb": "./bg/bg3_small.jpg",
|
||||
"title": "扬帆起航"
|
||||
},
|
||||
{
|
||||
"pic": "./plugins/theme_switcher/bg/bg4.jpg",
|
||||
"thumb": "./bg/bg4_small.jpg",
|
||||
"title": "乡土气息"
|
||||
},
|
||||
{
|
||||
"pic": "./plugins/theme_switcher/bg/bg5.jpg",
|
||||
"thumb": "./bg/bg5_small.jpg",
|
||||
"title": "绿色清新"
|
||||
},
|
||||
{
|
||||
"pic": "./plugins/theme_switcher/bg/bg6.jpg",
|
||||
"thumb": "./bg/bg6_small.jpg",
|
||||
"title": "Win8"
|
||||
},
|
||||
{
|
||||
"pic": "./plugins/theme_switcher/bg/bg7.jpg",
|
||||
"thumb": "./bg/bg7_small.jpg",
|
||||
"title": "蓝色海岸"
|
||||
},
|
||||
{
|
||||
"pic": "./plugins/theme_switcher/bg/bg8.jpg",
|
||||
"thumb": "./bg/bg8_small.jpg",
|
||||
"title": "冰天雪地"
|
||||
},
|
||||
{
|
||||
"pic": "./plugins/theme_switcher/bg/bg9.jpg",
|
||||
"thumb": "./bg/bg9_small.jpg",
|
||||
"title": "繁花满树"
|
||||
},
|
||||
{
|
||||
"pic": "./plugins/theme_switcher/bg/bg10.jpg",
|
||||
"thumb": "./bg/bg10_small.jpg",
|
||||
"title": "精灵小鸟"
|
||||
},
|
||||
{
|
||||
"pic": "./plugins/theme_switcher/bg/bg11.jpg",
|
||||
"thumb": "./bg/bg11_small.jpg",
|
||||
"title": "炫酷跑车"
|
||||
},
|
||||
{
|
||||
"pic": "./plugins/theme_switcher/bg/bg12.jpg",
|
||||
"thumb": "./bg/bg12_small.jpg",
|
||||
"title": "中国风"
|
||||
},
|
||||
{
|
||||
"pic": "./plugins/theme_switcher/bg/bg13.jpg",
|
||||
"thumb": "./bg/bg13_small.jpg",
|
||||
"title": "Winxp"
|
||||
},
|
||||
{
|
||||
"pic": "./plugins/theme_switcher/bg/bg14.jpg",
|
||||
"thumb": "./bg/bg14_small.jpg",
|
||||
"title": "淡雅唯美"
|
||||
},
|
||||
{
|
||||
"pic": "./plugins/theme_switcher/bg/bg15.jpg",
|
||||
"thumb": "./bg/bg15_small.jpg",
|
||||
"title": "Win7"
|
||||
},
|
||||
];
|
||||
|
||||
var theme_area=$("#theme_area");
|
||||
theme_area.on('click','.theme_setting',function () {
|
||||
var pic=$(this).data('pic');
|
||||
Win10_parent.setBgUrl({main:pic});
|
||||
|
||||
//此处你也许想用ajax把修改信息保存到服务器。。。
|
||||
|
||||
});
|
||||
|
||||
|
||||
|
||||
|
||||
themes.forEach(function (t) {
|
||||
var theme=$("<a href=\"javascript:;\" data-pic=\""+t.pic+"\" class=\"theme_setting \">\n" +
|
||||
" <div class=\"theme_icon\"><img src=\""+t.thumb+"\"></div>\n" +
|
||||
" <div class=\"theme_text\">"+t.title+"</div>\n" +
|
||||
" </a>");
|
||||
theme_area.append(theme)
|
||||
});
|
||||
|
||||
|
||||
});
|
||||