css设置弹出信息,javaScript自定义alert弹出信息窗口

1.弹出消息,带关闭按钮[点击演示]

2.弹出成功信息,1秒后自动关闭[点击演示][点击演示]

3.弹出失败信息,1秒后自动关闭[点击演示][点击演示]

4.综合应用 xcsoft.alert('内容','error|success|show',秒数)

操作说明:

1.需要载入jquery,如果页面上不载入jquery,则使用xcsoft.jquery(),即可自动载入 [函数使用说明]

xcsoft.jquery();//自动加载jquery

xcsoft.jquery(function(e){

//此处和jquery中的$(function(){})一致,即加载完后执行

xcsoft.initialize();//添加此代码可实现按ESC键关闭弹出窗口

});

2.关于弹出窗口的小图标可以css样式中设置

#xcsoftAlert .error{background:url(http://www.xcsoft.cn/public/images/info.png) 0 -32px; }

#xcsoftAlert .show{background:url(http://www.xcsoft.cn/public/images/info.png) 0 -64px; }

#xcsoftAlert .success{background:url(http://www.xcsoft.cn/public/images/info.png);}

3.以下参数为默认值,可自行修改xcsoft.second=1000;//默认1秒后退出

xcsoft.gradual=200;//0.2秒的淡入淡出

xcsoft.rebound=50;//弹窗默认向上移动50像素

xcsoft.clickHide=false;//自动退出状态时,是否启动点击立即退出

//以下参数为本插件默认全部参数,可全修改,或者单个修改

//如:xcsoft.alertparam.show.background="#f00";

//如:xcsoft.alertparam.error={borderColor:"#ff0",borderWidth:'10px'}

xcsoft.alertparam={

borderColor:"rgba(0,144,228,0.8)",

borderWidth:"5px",

background:"#fff",

showColor:"#0090e4",

errorColor:"#f00",

successColor:"#390",

show:{

borderColor:"#0090e4",

borderWidth:"5px",

background:"#fff",

color:'#0090e4'

},

error:{

borderColor:"#f00",

borderWidth:"5px",

background:"#fff",

color:'#f00'

},

success:{

borderColor:"#390",

borderWidth:"5px",

background:"#fff",

color:'#390'

},

}

4.后续版本...

标签

按键盘左右方向键可快速浏览上一篇(←)、下一篇(→)