jquery ui实现windows窗口操作系统桌面及图标打开效果代码-html代码-BFW代码库

代码语言：html

所属分类：其他

代码描述：jquery ui实现windows窗口操作系统桌面及图标打开效果代码

下面为部分代码预览，完整代码请点击下载或在bfwstudio webide中打开


<!DOCTYPE html>
<html lang="en" >

<head>

  <meta charset="UTF-8">
  
<link type="text/css" rel="stylesheet" href="//repo.bfw.wiki/bfwrepo/css/jquery-ui.css">
  
<style>
html		{ margin:0px; padding:0px; }
body		{ margin:0px; padding:0px; }
div			{ margin:0px; padding:0px; }
span		{ margin:0px; padding:0px; }
ul			{ margin:0px; padding:0px; }
li			{ margin:0px; padding:0px; list-style:none; }
fieldset	{ margin:0px; padding:0px; }
legend		{ margin:0px; padding:0px; }
label		{ margin:0px; padding:0px; }
form		{ margin:0px; padding:0px; }
input		{ margin:0px; padding:0px; outline:none; }
select		{ margin:0px; padding:0px; outline:none;}
option		{ margin:0px; padding:0px; }
textarea	{ margin:0px; padding:0px; outline:none;}
table		{ margin:0px; padding:0px; }
tr			{ margin:0px; padding:0px; }
td			{ margin:0px; padding:0px; }
a			{ margin:0px; padding:0px; }
p			{ margin:0px; padding:0px; }
h1			{ margin:0px; padding:0px; }
h2			{ margin:0px; padding:0px; }
h3			{ margin:0px; padding:0px; }
img			{ margin:0px; padding:0px; border:0px; }

a 			{ color:#333; text-decoration:none; }
a:hover		{ color:#999; text-decoration:none; }
a:active 	{ color:#333; text-decoration:none; }
a:visited 	{ color:#333; text-decoration:none; }

/* ============== CSS Default ============== */

body
{
	font-family:Verdana, Geneva, sans-serif; 
	font-size:12px;
	color:#333;
	background:#FFF;
	overflow-x:hidden;
}

input[type=submit], input[type=button]
{
	background:#CCC;
	background:-webkit-linear-gradient(#FFF, #DDD);
	background:-moz-linear-gradient(#FFF, #DDD);
	background:-o-linear-gradient(#FFF, #DDD);
	
	font-family:Verdana, Geneva, sans-serif;
	font-size:12px;
	
	border:1px #BBB solid;
	border-radius:3px;
	
	padding:4px 12px 4px 12px;
	
	box-shadow:1px 1px 1px rgba(0,0,0,0.1);
	
}

button, input[type=submit], input[type=button], #x:-moz-any-link, x:default 
{
	padding:2px 10px 2px 10px !important;
}

input[type=submit]:disabled, input[type=button]:disabled, 
input[type=submit]:hover:disabled, input[type=button]:hover:disabled, 
input[type=submit]:active:disabled, input[type=button]:active:disabled
{
	background:#CCC;
	background:-webkit-linear-gradient(#FFF, #DDD);
	background:-moz-linear-gradient(#FFF, #DDD);
	background:-o-linear-gradient(#FFF, #DDD);
	
	box-shadow:1px 1px 1px rgba(0,0,0,0.1);
	
	cursor:not-allowed;

	opacity:0.6;
}

input[type=submit]:hover, input[type=button]:hover
{
	background:#DDD;
	background:-webkit-linear-gradient(#FFF, #EEE);
	background:-moz-linear-gradient(#FFF, #EEE);
	background:-o-linear-gradient(#FFF, #EEE);
}

input[type=submit]:active, input[type=button]:active
{
	background:#CCC;
	background:-webkit-linear-gradient(#EEE, #CCC);
	background:-moz-linear-gradient(#EEE, #CCC);
	background:-o-linear-gradient(#EEE, #CCC);
	box-shadow:inset 1px 1px 1px rgba(0,0,0,0.3);
}

input[type=text], input[type=password]
{
	background:#FFF;
	border:1px #BBB solid;
	border-radius:3px;
	
	font-family:Verdana, Geneva, sans-serif;
	font-size:12px;
	
	width:140px;
	
	padding:4px 4px 4px 4px;
	
	box-shadow:inset 1px 1px 3px rgba(0,0,0,0.2);
	
}

input[type=text], input[type=password], #x:-moz-any-link, x:default 
{
	padding:3px !important;
}

input[type=text]:disabled, input[type=password]:disabled, 
input[type=text]:hover:disabled, input[type=password]:hover:disabled, 
input[type=text]:active:disabled, input[type=password]:active:disabled,
select:disabled, textarea:disabled
{
	cursor:not-allowed;
	opacity:0.6;
}

input:focus, select:focus, textarea:focus
{
	border:1px #333 solid;
}

select
{
	border:1px #BBB solid;
	border-radius:3px;
	
	font-family:Verdana, Geneva, sans-serif;
	font-size:12px;
	
	padding:3px 3px 3px 3px;		
}

select, #x:-moz-any-link, x:default 
{
	padding:2px !important;
}

option
{
}

textarea
{	
	border:1px #BBB solid;
	border-radius:3px;
	
	min-width:140px;
	max-width:auto;
	min-height:80px;
	max-height:120px;
	
	font-family:Verdana, Geneva, sans-serif;
	font-size:12px;
	
	resize:vertical;
	
	padding:5px;	
	
	box-shadow:inset 1px 1px 3px rgba(0,0,0,0.2);
}

textarea, #x:-moz-any-link, x:default 
{
	padding:3px !important;
}

#false-button	
{
	position:relative;
	background:#CCC;
	background:-webkit-linear-gradient(#FFF, #DDD);
	background:-moz-linear-gradient(#FFF, #DDD);
	background:-o-linear-gradient(#FFF, #DDD);
	
	border:1px #BBB solid;
	border-radius:3px;
	
	padding:4px 12px 4px 12px;
	
	box-shadow:1px 1px 1px rgba(0,0,0,0.1);
	
	cursor:default;
}

#false-button:hover
{
	background:#DDD;
	background:-webkit-linear-gradient(#FFF, #EEE);
	background:-moz-linear-gradient(#FFF, #EEE);
	background:-o-linear-gradient(#FFF, #EEE);
}

#false-button:active	
{
	background:#CCC;
	background:-webkit-linear-gradient(#EEE, #CCC);
	background:-moz-linear-gradient(#EEE, #CCC);
	background:-o-linear-gradient(#EEE, #CCC);
	box-shadow:inset 1px 1px 1px rgba(0,0,0,0.3);
}

body
{ 
	margin:0px; 
	font-family:Verdana, Geneva, sans-serif;
	overflow:hidden;
}
#wrap
{
	position:absolute; 
	width:100%; 
	height:100%;
	z-index:500;
	display:none;
}
#wrap-window
{
	position:absolute; 
	width:100%; 
	height:100%;
	z-index:53;
	disp.........完整代码请登录后点击上方下载按钮下载查看