弹出消息框的不同位置效果

将代码放到zkDemo 中可测试:

 

<vbox>
<textbox value="Jerry"  type="password" width="150px">
       <attribute name="onChange">
                newpw.open(self,"end_before");
                self.setStyle("border: 1px solid #ed7a66;");
        </attribute>
</textbox>
<popup id="newpw">
      <image src="/img/Centigrade-Widget-Icons/ArrowLeft-16x16.png"/>
      <label value="两次输入密码不一致,请重新输入!" style="color::Red"/>
      <image src="/img/Centigrade-Widget-Icons/PaperClip-16x16.png" onClick="newpw.close()"/>
</popup>
 </vbox> 
 

红色位置可选参数:

before_start
the popup appears above the anchor, aligned on the left. 效果:附图1 before_end
the popup appears above the anchor, aligned on the right. 效果:附图2 after_start
the popup appears below the anchor, aligned on the left. 效果:附图3
after_end
the popup appears below the anchor, aligned on the right. 效果:附图4 start_before
the popup appears to the left of the anchor, aligned on the top. 效果:附图5 start_after
the popup appears to the left of the anchor, aligned on the bottom. 效果:附图6 end_before
the popup appears to the right of the anchor, aligned on the top. 效果:附图7
end_after
the popup appears to the right of the anchor, aligned on the bottom. 效果:附图8 overlap
the popup overlaps the anchor, with the top-left corners of both the anchor and popup aligned. 效果:附图9 overlap_end
the popup overlaps the anchor, with the top-right corners of both the anchor and popup aligned. (since 3.6.3) overlap_before
the popup overlaps the anchor, with the bottom-left corners of both the anchor and popup aligned. (since 3.6.3) overlap_after
the popup overlaps the anchor, with the bottom-right corners of both the anchor and popup aligned. (since 3.6.3) after_pointer
the popup appears with the top aligned with the bottom of the anchor, with the topleft corner of the popup at the horizontal position of the mouse pointer.

 

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值