HTML+CSS3 纯代码实现转盘效果
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title></title>
<script src="/Scripts/jquery-1.10.2.min.js"></script> <link rel="stylesheet" href="">
<style>
*{
padding:0;
margin:0;
font: 24px/24px "Microsoft Yahei";
color:white;
}
body{
background:#202020;
}
.main{
width: 1520px;
height:900px;
background:#06192A;
margin:0 auto;
border:2px solid white;
}
.main header{
height: 150px;
border-bottom:2px solid #637382;
}
.main header h1{
text-align:center;
font-weight:bolder;
position: relative;
bottom:0;
padding-top: 104px;
}
.main section{
width:1350px;
/*border-bottom:2px solid #637382;*/
margin:0 auto;
/*padding-top:50px;
padding-left:98.5px;*/ display:inline-block;
padding-top: 50px;
padding-left: 170px;
} .main section .round{
width:300px;
height:300px;
position: relative;
/*background:gray;*/
border-radius:50%; margin-right: 150px;
margin-bottom: 30px;
float:left;
} .main section .round ul{
list-style: none;
margin: 0;
padding: 0;
} .main section .round ul.mark li{
width:2px;
height:18px;
display:block;
background:white;
position: absolute;
top:50%;
left:50%;
} .main section .round ul.mark li:nth-child(odd){
height:26px;
top: calc(50% - 4px);
} .digits::before{
width: 34px;
height: 34px;
position: absolute;
border-radius:50%;
top:calc(50% - 8px);
left:calc(50% - 17px);
content:"";
background:#003951;
} .digits::after{
position: absolute;
top: 181px;
left: 137px;
content:"MPH";
font-size:12px;
font-weight:lighter;
opacity:0.5;
} .main section .round ul.digits li{
font-size: 20px;
display: block;
position: absolute;
top: 50%;
left: 50%;
line-height: 20px;
text-align: center;
font-weight: lighter;
} .main section .round ul.digits li:nth-child(1){
transform: translate(-93px, 35px);
}
.main section .round ul.digits li:nth-child(2){
transform: translate(-95px, -25px);
}
.main section .round ul.digits li:nth-child(3){
transform: translate(-65px, -70px);
}
.main section .round ul.digits li:nth-child(4){
transform: translate(-18px, -90px);
}
.main section .round ul.digits li:nth-child(5){
transform: translate(45px, -70px);
}
.main section .round ul.digits li:nth-child(6){
transform: translate(60px, -25px);
}
.main section .round ul.digits li:nth-child(7){
transform: translate(68px, 35px);
} .main section .round .hand{
width: .2em;
height: .2em;
background: #c00;
border-radius: 50%;
position: absolute;
top: 157px;
left: 148px; -webkit-transition: all 1s linear;
-moz-transition: all 1s linear;
-ms-transition: all 1s linear;
-o-transition: all 1s linear;
transition: all 1s linear; -webkit-transform: rotate(0deg);
-moz-transform: rotate(0deg);
transform: rotate(0deg);
box-shadow: rgba(0, 0, 0, .8) 0 0 .2em;
} .main section .round .hand:before{
content: "";
width: .2em;
height: 128px;
border-radius: .2em .2em 0 0/10em 10em 0 0;
background: #c00;
position: absolute;
top: -127px;
left: .1em;
margin: 0 0 -2em -.1em;
} .main section .round .digital{
position: absolute;
top: 225px;
left: 76px;
} .main section .round .digital input,.main section .round .digital ul{
float:left;
} .main section .round .digital ul{
width:20px;
height: 30px;
color: #ddd;
font-family: Consolas, monaco, monospace;
background:#000009;
margin:0 1px !important;
text-align:center;
overflow:hidden;
position: relative;
} .main section .round .digital ul li{
width:18px;
height:26px;
margin-top:2px;
background:#1A2730;
/*font-weight:lighter;*/
position: relative;
overflow:hidden;
margin-left:1px;
} .main section .round .digital ul.mph,.main section .round .digital ul.mph li{
background:none;
cursor: pointer;
overflow:visible;
} .main section .round .digital ul.mph li{
height: 30px;
margin-top:0;
} .main section .round .digital ul.mph b,.main section .round .digital ul.mph b:before,.main section .round .digital ul.mph span{
display:block;
position: relative;
}
.main section .round .digital ul.mph b{
width:16px;
height:16px;
border-radius:8px;
background:white;
top:-2px;
margin-left:2px;
} .main section .round .digital ul.mph b.selected:before{
background:red;
width:12px;
height: 12px;
content:"";
border-radius:6px;
top:2px;
left:2px;
} .main section .round .digital ul.mph span{
width:20px;
height:15px;
font-size:12px;
top:-6px;
} .main section .round .digital ul.mph:first-child{
margin-right: 10px !important;
} .main section .round .digital ul.mph:last-child{
margin-left: 10px !important;
} .main section .round p{
position: absolute;
bottom:10px;
text-align:center;
width: 100%;
font-size:21px;
} .main section .round .digital ul li span {
width: 20px;
height: 26px;
display: block;
position: relative;
top: -234px;
} .main section .round .digital ul.d4/*:nth-child(4)*/ li{
/* -webkit-transition: all 1s linear;
-moz-transition: all 1s linear;
-ms-transition: all 1s linear;
-o-transition: all 1s linear;
transition: all 1s linear;*/
} #r1 .digital ul.d4 li{
top: -252px;
} #r2 .digital ul.d4 li{
top: -168px;
} #r3 .digital ul.d4 li{
top: -140px;
} #r4 .digital ul.d3 li{
top: -84px;
} #r4 .digital ul.d4 li{
top: -112px;
} #r5 .digital ul.d4 li{
top: -112px;
} #r6 .digital ul.d4 li{
top: -224px;
}
</style>
</head>
<body>
<div class="main">
<header>
<h1>心血管医用气体</h1>
</header>
<section>
<div class="round" id="r1" data-value="0.42">
<ul class="mark">
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
</ul>
<ul class="digits">
<li>0.3</li>
<li>0.35</li>
<li>0.4</li>
<li>0.45</li>
<li>0.5</li>
<li>0.55</li>
<li>0.6</li>
</ul>
<div class="hand"></div>
<div class="digital">
<ul class="mph">
<li>
<b id="low" data-id="0"></b>
<span for="low">低</span>
</li>
</ul>
<ul>
<li>0</li>
</ul>
<ul>
<li>.</li>
</ul>
<ul>
<li>4</li>
</ul>
<ul class="d4">
<li>9</li>
<li>8</li>
<li>7</li>
<li>6</li>
<li>5</li>
<li>4</li>
<li>3</li>
<li>2</li>
<li>1</li>
<li>0</li>
</ul>
<ul class="mph">
<li>
<b class="selected" id="hight" data-id="1"></b>
<span for="hight">高</span>
</li>
</ul>
</div>
<p>氧气区域管线压力</p>
</div>
<div class="round" id="r2" data-value="0.43">
<ul class="mark">
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
</ul>
<ul class="digits">
<li>0.3</li>
<li>0.35</li>
<li>0.4</li>
<li>0.45</li>
<li>0.5</li>
<li>0.55</li>
<li>0.6</li>
</ul>
<div class="hand"></div>
<div class="digital">
<ul class="mph">
<li>
<b id="low" data-id="0"></b>
<span for="low">低</span>
</li>
</ul>
<ul>
<li>0</li>
</ul>
<ul>
<li>.</li>
</ul>
<ul>
<li>4</li>
</ul>
<ul class="d4">
<li>9</li>
<li>8</li>
<li>7</li>
<li>6</li>
<li>5</li>
<li>4</li>
<li>3</li>
<li>2</li>
<li>1</li>
<li>0</li>
</ul>
<ul class="mph">
<li>
<b class="selected" id="hight" data-id="1"></b>
<span for="hight">高</span>
</li>
</ul>
</div>
<p>压缩空气区域管线压力</p>
</div>
<div class="round" id="r3" data-value="0.44">
<ul class="mark">
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
</ul>
<ul class="digits">
<li>0.3</li>
<li>0.35</li>
<li>0.4</li>
<li>0.45</li>
<li>0.5</li>
<li>0.55</li>
<li>0.6</li>
</ul>
<div class="hand"></div>
<div class="digital">
<ul class="mph">
<li>
<b id="low" data-id="0"></b>
<span for="low">低</span>
</li>
</ul>
<ul>
<li>0</li>
</ul>
<ul>
<li>.</li>
</ul>
<ul>
<li>4</li>
</ul>
<ul class="d4">
<li>9</li>
<li>8</li>
<li>7</li>
<li>6</li>
<li>5</li>
<li>4</li>
<li>3</li>
<li>2</li>
<li>1</li>
<li>0</li>
</ul>
<ul class="mph">
<li>
<b class="selected" id="hight" data-id="1"></b>
<span for="hight">高</span>
</li>
</ul>
</div>
<p>CO2区域管线压力</p>
</div>
<div class="round" id="r4" data-value="0066">
<ul class="mark">
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
</ul>
<ul class="digits">
<li>30</li>
<li>40</li>
<li>50</li>
<li style="transform:translate(-10px, -90px);">60</li>
<li>70</li>
<li style="transform:translate(75px, -25px);">80</li>
<li style="transform:translate(72px, 35px);">90</li>
</ul>
<div class="hand"></div>
<div class="digital">
<ul class="mph">
<li>
<b id="low" data-id="0"></b>
<span for="low">低</span>
</li>
</ul>
<ul>
<li>0</li>
</ul>
<ul>
<li>0</li>
</ul>
<ul class="d3">
<li>9</li>
<li>8</li>
<li>7</li>
<li>6</li>
<li>5</li>
<li>4</li>
<li>3</li>
<li>2</li>
<li>1</li>
<li>0</li>
</ul>
<ul class="d4">
<li>9</li>
<li>8</li>
<li>7</li>
<li>6</li>
<li>5</li>
<li>4</li>
<li>3</li>
<li>2</li>
<li>1</li>
<li>0</li>
</ul>
<ul class="mph">
<li>
<b class="selected" id="hight" data-id="1"></b>
<span for="hight">高</span>
</li>
</ul>
</div>
<p>真空区域管线压力</p>
</div>
<div class="round" id="r5" data-value="0.45">
<ul class="mark">
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
</ul>
<ul class="digits">
<li>0.3</li>
<li>0.35</li>
<li>0.4</li>
<li>0.45</li>
<li>0.5</li>
<li>0.55</li>
<li>0.6</li>
</ul>
<div class="hand"></div>
<div class="digital">
<ul class="mph">
<li>
<b id="low" data-id="0"></b>
<span for="low">低</span>
</li>
</ul>
<ul>
<li>0</li>
</ul>
<ul>
<li>.</li>
</ul>
<ul>
<li>4</li>
</ul>
<ul class="d4">
<li>9</li>
<li>8</li>
<li>7</li>
<li>6</li>
<li>5</li>
<li>4</li>
<li>3</li>
<li>2</li>
<li>1</li>
<li>0</li>
</ul>
<ul class="mph">
<li>
<b class="selected" id="hight" data-id="1"></b>
<span for="hight">高</span>
</li>
</ul>
</div>
<p>笑气区域管线压力</p>
</div>
<div class="round" id="r6" data-value="0.51">
<ul class="mark">
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
</ul>
<ul class="digits">
<li>0.3</li>
<li>0.35</li>
<li>0.4</li>
<li>0.45</li>
<li>0.5</li>
<li>0.55</li>
<li>0.6</li>
</ul>
<div class="hand"></div>
<div class="digital">
<ul class="mph">
<li>
<b id="low" data-id="0"></b>
<span for="low">低</span>
</li>
</ul>
<ul>
<li>0</li>
</ul>
<ul>
<li>.</li>
</ul>
<ul>
<li>5</li>
</ul>
<ul class="d4">
<li>9</li>
<li>8</li>
<li>7</li>
<li>6</li>
<li>5</li>
<li>4</li>
<li>3</li>
<li>2</li>
<li>1</li>
<li>0</li>
</ul>
<ul class="mph">
<li>
<b class="selected" id="hight" data-id="1"></b>
<span for="hight">高</span>
</li>
</ul>
</div>
<p>氮气区域管线压力</p>
</div>
</section>
</div>
</body>
<script>
$(".round").each(function(){
var deg = -110;
$(this).find("ul.mark li").each(function(){
var ty = "-120px";
if($(this).index() % 2 == 0){
ty = "-115px";
} $(this).css("transform","rotate("+deg+"deg) translateY("+ty+")");
deg += 220 / 24;
});
}); $(".digital").find("ul:not(.mph):last").click(function(){ }); function getDeg(num){
return -110 + 220 / 24 * (num - 1);
} var dig = 28;
//---------r1---------
var r1_deg = getDeg(9);
$("#r1").find(".hand")
.css("transform","rotate("+r1_deg+"deg)"); var r1_status = false; setTimeout(function(){
var r1 = $("#r1"); r1_status = null; var new_r1_deg = getDeg(13) r1.find(".hand").css("transform","rotate("+new_r1_deg+"deg)");
var num = r1.find(".d4 li").css("top"); num = num.substring(0,num.length - 2); //r1.find(".d4 li").css("top",parseInt(num) + 28 * 5 + "px");
r1.find(".d4 li").animate({
top: parseInt(num) + 28 * 5 + "px"
},1500);
}, 3000); setTimeout(function(){
r1_status = true;
},5000); setInterval(function(){
if(r1_status == null){return;} var r1 = $("#r1").find(".hand")[0]; var r1_deg = r1.style.cssText; var n = r1_deg.substring(18,r1_deg.length - 5); n = r1_status ? parseFloat(n) + 2 : parseFloat(n) - 2; r1.style.cssText = "transform:rotate("+n+"deg)"; r1_status = !r1_status;
},500); //---------r2---------
$("#r2").find(".hand")
.css("transform","rotate(-12.5deg)"); var r2_status = false; setTimeout(function(){
var r2 = $("#r2"); r2_status = null; var new_r2_deg = getDeg(9) r2.find(".hand").css("transform","rotate("+new_r2_deg+"deg)");
var num = r2.find(".d4 li").css("top"); num = num.substring(0,num.length - 2); //r2.find(".d4 li").css("top",parseInt(num) + 28 * 5 + "px");
r2.find(".d4 li").animate({
top: parseInt(num) - 28 * 3 + "px"
},1500);
}, 5000); setTimeout(function(){
r2_status = true;
},6000); setInterval(function(){
if(r2_status == null){return;} var r2 = $("#r2").find(".hand")[0]; var r2_deg = r2.style.cssText; var n = r2_deg.substring(18,r2_deg.length - 5); n = r2_status ? parseFloat(n) + 2 : parseFloat(n) - 2; r2.style.cssText = "transform:rotate("+n+"deg)"; r2_status = !r2_status;
},500); //---------r3---------
$("#r3").find(".hand")
.css("transform","rotate(-3.9deg)"); var r3_status = false;
//*
setInterval(function(){
if(r3_status == null){return;} var r3 = $("#r3").find(".hand")[0]; var r3_deg = r3.style.cssText; var n = r3_deg.substring(18,r3_deg.length - 5); n = r3_status ? parseFloat(n) + 2 : parseFloat(n) - 2; r3.style.cssText = "transform:rotate("+n+"deg)"; r3_status = !r3_status;
},500);//*/ //---------r4---------
var r4_deg = getDeg(15);
$("#r4").find(".hand")
.css("transform","rotate("+r4_deg+"deg)"); var r4_status = true; setTimeout(function(){
var r4 = $("#r4"); r4_status = null; var new_r4_deg = getDeg(17) r4.find(".hand").css("transform","rotate("+new_r4_deg+"deg)"); var num = r4.find(".d4 li").css("top");
num = num.substring(0,num.length - 2); //r4.find(".d4 li").css("top",parseInt(num) + 28 * i + "px"); r4.find(".d4 li").animate({
top: parseInt(num) + 28 * 4 + "px"
},1000, function() {
var d3 = r4.find(".d3 li").css("top");
d3 = d3.substring(0,d3.length - 2); r4.find(".d4 li").stop();
r4.find(".d4 li").css("top","-252px"); r4.find(".d3 li").css("top",parseInt(d3) + 28 + "px"); r4_status = false;
});
}, 7000);
/*
setTimeout(function(){
var r4 = $("#r4");
var d3 = r4.find(".d3 li").css("top");
d3 = d3.substring(0,d3.length - 2); r4.find(".d4 li").stop();
r4.find(".d4 li").css("top","-252px"); r4.find(".d3 li").css("top",parseInt(d3) + 28 + "px");
}, 6000);
*/
//*
setInterval(function(){
if(r4_status == null){return;} var r4 = $("#r4").find(".hand")[0]; var r4_deg = r4.style.cssText; var n = r4_deg.substring(18,r4_deg.length - 5); n = r4_status ? parseFloat(n) + 2 : parseFloat(n) - 2; r4.style.cssText = "transform:rotate("+n+"deg)"; r4_status = !r4_status;
},500);//*/ var r5_deg = getDeg(13);
$("#r5").find(".hand")
.css("transform","rotate("+r5_deg+"deg)");
var r5_status = false;
//*
setInterval(function(){
if(r5_status == null){return;} var r5 = $("#r5").find(".hand")[0]; var r5_deg = r5.style.cssText; var n = r5_deg.substring(18,r5_deg.length - 5); n = r5_status ? parseFloat(n) + 2 : parseFloat(n) - 2; r5.style.cssText = "transform:rotate("+n+"deg)"; r5_status = !r5_status;
},500);//*/ var r6_deg = getDeg(17);
$("#r6").find(".hand")
.css("transform","rotate(42.666667deg)");
var r6_status = false; setTimeout(function(){
var r6 = $("#r6"); r6_status = null; var new_r6_deg = getDeg(21) r6.find(".hand").css("transform","rotate("+new_r6_deg+"deg)");
var num = r6.find(".d4 li").css("top"); num = num.substring(0,num.length - 2); //r6.find(".d4 li").css("top",parseInt(num) + 28 * 5 + "px");
r6.find(".d4 li").animate({
top: parseInt(num) + 28 * 4 + "px"
},1500);
}, 9000); setTimeout(function(){
r6_status = true;
},10000);
//*
setInterval(function(){
if(r6_status == null){return;} var r6 = $("#r6").find(".hand")[0]; var r6_deg = r6.style.cssText; var n = r6_deg.substring(18,r6_deg.length - 5); n = r6_status ? parseFloat(n) + 2 : parseFloat(n) - 2; r6.style.cssText = "transform:rotate("+n+"deg)"; r6_status = !r6_status;
},500);//*/
</script>
</html>
HTML+CSS3 纯代码实现转盘效果的更多相关文章
- css3纯手写loading效果
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...
- 心跳(纯代码制作心形,animation动画)
思路:利用两个长方形(比例是2:3 | 3:2)可以合成心形,然后利用动画,缩放大小实现心跳(纯代码),效果如下: <body> <div></div> </ ...
- 纯代码利用CSS3 圆角边框和盒子阴影 制作 iphone 手机效果
原文:纯代码利用CSS3 圆角边框和盒子阴影 制作 iphone 手机效果 大家好,我是小强老师. 今天我们看下CSS3最为简单的两个属性. css3给我们带来了很多视觉的感受和变化,以前的图片做的事 ...
- 纯CSS3实现的动感菜单效果
1. [代码] 纯CSS3实现的动感菜单效果 <!DOCTYPE html><head><meta http-equiv="Content-Type" ...
- Android 纯代码加入点击效果
项目中非常多的Button, 同一时候配置非常多button切图,Selector是不是非常烦, 使用以下这个类,就能够直接为Button添加点击效果. 不用多个图片,不用Selector. 使用方法 ...
- AS3.0纯代码编写的两款loading效果
AS3.0纯代码编写的两款loading效果 效果一 效果二 代码很简单,实现的原理一样,只不过矩形用到了Matrix类,对注册点进行了调整,效果可用于视频播放器缓冲时的loading效果,下面看代码 ...
- Long Shadows Generate是一款在线使用纯CSS3实现长阴影的效果,一款强大的扁平化长投影制造器。
Long Shadows Generate是一款在线使用纯CSS3实现长阴影的效果,一款强大的扁平化长投影制造器. Long Shadows Generate 彩蛋爆料直击现场 Long Shadow ...
- 9种纯CSS3人物信息卡片动态展示效果
<!DOCTYPE html> <html lang="zh"> <head> <meta charset="UTF-8&quo ...
- 利用target的特性,可以实现纯css的tab效果切换
基础知识: :target起作用的是href连接到的位置 如 <a href="#tab1">tab1</a> <div id="tab1& ...
随机推荐
- [iOS基础控件 - 6.11.5] 沙盒 & 数据存储
A.沙盒 每个APP都有一个沙盒,是独立存在的 1.Xcode5和Xcode6的模拟器文件目录 a.模拟器路径改版 (1)Xcode5中模拟器路径为:/Users/用户名/Library/Appl ...
- UVaLive 7269 Snake Carpet (找规律,模拟)
题意:给定一个数字n,表示有n条蛇,然后蛇的长度是 i ,如果 i 是奇数,那么它只能拐奇数个弯,如果是偶数只能拐偶数个,1, 2除外,然后把这 n 条蛇, 放到一个w*h的矩阵里,要求正好放满,让你 ...
- Base64.java 工具类
import java.io.ByteArrayInputStream; import java.io.ByteArrayOutputStream; import java.io.IOExceptio ...
- Java中的Filter过滤器
Filter简介 Filter也称之为过滤器,它是Servlet技术中最实用的技术,Web开发人员通过Filter技术,对web服务器管理的所有web资源:例如Jsp, Servlet, 静态图片文件 ...
- Lua学习笔记(五):面向对象的实现
Lua本身是没有class之类的关键字的,但是我们可以巧妙利用function也是值和table的特性来实现面向对象的特性. 通过复制表的实现 Lua中的类也是一个table对象,下面我们看看一个简单 ...
- Lua学习笔记(二):基本语法
Lua学习指南:http://www.lua.org/manual/ 首先我们要明确的一点是:在Lua中,除了关键字外一切都是变量. Lua关键字 可以查看这个地址:http://www.lua.or ...
- PyQt入门系列(一):Hello World
开始搞PyQt了,顺便记录一下自己的学习!资料参考某大神的PyQt4 精彩实例分析,以及<征服Python>这本书. 下面是Demo: #-*- coding:utf-8 -*- #编码声 ...
- HDU 2136 Largest prime factor 參考代码
#include <iostream> #include <vector> #include <cmath> using namespace std; const ...
- Java多线程模式(二)
Guarded Suspension Pattern 该模式描述的是当一个线程在执行某个操作时,但由于其他资源还没有准备好,需要等待,那么就等待资源准备好才开始自己的操作.我们直接看代码例子 ...
- EDIT Ini写Ini配置
EDIT Ini写Ini配置 uses IniFiles; {$R *.dfm} function IniFileName:string; begin Result:=ExtractFil ...