jquerymessagetip信息语提⽰控件
编写原因:
作为提⽰框,jquery有个messagebox的控件,也就是弹出的提⽰框。但这个控件如果不是⽤在需要确认的时候,单单警告提⽰、消息提⽰、失败提⽰时,⽤户还需要去点下确认,有时这操作还是挺烦的(尽管可以设置timeout,会⾃动消失)。
控件需求:
现在需要⼀个简洁消息提⽰控件,不需确认。
1.提⽰框可以从顶部或底部滑⼊,在失效后滑出。
2.可以设置滑⼊时间,内容停留时间、滑出时间。
PS:⽐较简单的控件
效果如下
编写过程:
jquery框架定义
1.在⽆⽂档的情况下,我建议将⽤户能传的参数的定义写在控件的最前⾯。
var defaults = {
zIndex : 9999 ,
fadeInTimeOut : 1,  //second
contentTimeOut : 3,
fadeOutTimeOut : 1,
position : "top"    //show position    top  or bottom
};
这样使⽤者对他能够设的就⾮常清楚了,即便是没有⽂档,也能愉快的玩耍。
2.考虑浏览器的兼容性
因为控件的提⽰框是固定在底部或顶部的,不可避免的就是position:fixed的问题
IE6 IE7 IE8 固定定位元素 position:absolute ⽤设置,所以定位计算也要变化。
3.滑动效果的实现
滑⼊、内容停留、滑出。
具体的实现就不在这⾥说明,最后⾯会有源码链接。
PS:最主要东西就是上⾯这三个。
总结:
1.在强调的⽤户体验的年代,做这个控件也是为了⽤户能有更好的感受。
2.在做东西(编码)时,也时刻想能否这东西能否通⽤,⽽控件和框架也⽆⾮就是为了通⽤。
3.另附上我这个控件的下载链接
点击下载->
DEMO:
$.messageTip.info({
    message:"我是提⽰消息.......",
fadeInTimeOut : 1,  //滑⼊秒数
contentTimeOut : 3,  //内容停留秒数
fadeOutTimeOut : 1, ////滑出秒数
});

版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198,我们将在24小时内删除。