在需要alert的js代码中将alert方法替换成:
$("body").append("<div class='alert_div'><h1>提示</h1>" +
"<img src='ui/xix/components/resource/Model.CutPage/img/alertImg.png' />" +
"<span>您所输入的数字不合法!</span></div>");
- $ ('.alert_div').show ().delay (1000).fadeOut ();
方法:①直接在body中append一个新的class为alert_div的div,该div中包含提示的图片和相应的提示语;
②在alert_div展示出来的1000毫秒后自动消失;
注意:img的路径!!!
css可以更换提示框的代码风格:
/*alert弹框样式*/
.alert_div{
width:250px;
height:100px;
position:fixed;
left:45%;
top:30%;
background-color:#f7f7f7;
z-index:5000;
box-shadow:5px 5px 5px #ccc;
}
.alert_div>h1{
background-color:#2e5376;
font-size:16px;
color:#fff;
display:block;
width:100%;
height:30px;
line-height:30px;
margin-top:0px;
padding-left:10px;
}
.alert_div>img{
margin:0 5px 0 10px;
width:40px;
height:40px;
}
.alert_div>span{
display:inline-block;
height:30px;
line-height:30px;
margin-top:-10px;
color:#353535;
font-size:14px;
font-weight:bold;
}