本文索引
特性：纯 CSS & CSSS！打造；
支持更换图标、文字等；
自动显示 2 秒后自动隐藏；
非常适合做提示信息框；
import win.ui;
mainForm = win.form(text="tipsbox by Mr.R";right=759;bottom=469;)
mainForm.add()
import web.layout;
import web.layout.behavior.windowCommand;
wbLayout = web.layout( mainForm )
wbLayout.html =
<!doctype html>
<style type="text/css">
html,body{ height:100%; margin:0; }
body widget { size:*; }
body{size-changed!:
$1(#show_msg).fade = "true" ,
$1(#show_msg):value = self.box-border-width() + "," + self.box-border-height();}
#show_msg{
position: absolute;
top:50%%;left:50%%;
width: calc(text-width(self:value));
max-width:400px;
height:85px;line-height:85px;
padding:0 30 0 80;
flow:horizontal;
background:#ccc;
border-radius:15px;
foreground-image:url(res\fill.png);
foreground-repeat:no-repeat;
foreground-position:30px 50%;
color:2c2c2c;font-size: 18px;
display:none;opacity: 0;
overflow: hidden;}
#show_msg[tips = "yes"]{
foreground-image:url(res\fill_w.png);
}
#show_msg[fade = "true"]{
assigned!:
self::opacity = 0.01,
self::display = "block",
self.start-animation();
animation-step!:
self::opacity < 1.0 ? ( self::opacity = self::opacity + 0.1, return 15 )# ( self.fade = "close", return cancel ); } #show_msg[fade = "close"]{ assigned!: self.start-timer(2000); timer!: self::opacity = 1.0, self::display = "block", self.start-animation(); animation-step!: self::opacity > 0 ?
( self::opacity = self::opacity - 0.1, return 15)#
(self.fade = none,self::display ="none",self::opacity =9,return cancel);
}
button {width:48px;height:28px;border:1px solid #999;background:#fff;border-radius: 5px;padding:0 8 0 8;margin:10px;}
#btn{click!: $1(#show_msg).fade = "true" ,$1(#show_msg).tips = none;}
#btn1{click!: $1(#show_msg).fade = "true" ,$1(#show_msg):value = "提示内容";}
#btn2{click!: $1(#show_msg).tips = "yes" , $1(#show_msg).fade = "true" ,$1(#show_msg):value = "厉害了我的哥";}
</style>
这是默认文字
mainForm.show() return win.loopMessage();
下载地址
隐藏内容，您需要满足以下条件方可查看
End
学习快乐
我快乐
很好学习学习
不错
学习
看看
厉害厉害