js的alert样式如何更改如背景颜色


Posted in Javascript onJanuary 22, 2014
window.alert = function(str) 
{ 
var shield = document.createElement("DIV"); 
shield.id = "shield"; 
shield.style.position = "absolute"; 
shield.style.left = "0px"; 
shield.style.top = "0px"; 
shield.style.width = "100%"; 
shield.style.height = document.body.scrollHeight+"px"; 
//弹出对话框时的背景颜色 
shield.style.background = "#fff"; 
shield.style.textAlign = "center"; 
shield.style.zIndex = "25"; 
//背景透明 IE有效 
//shield.style.filter = "alpha(opacity=0)"; 
var alertFram = document.createElement("DIV"); 
alertFram.id="alertFram"; 
alertFram.style.position = "absolute"; 
alertFram.style.left = "50%"; 
alertFram.style.top = "50%"; 
alertFram.style.marginLeft = "-225px"; 
alertFram.style.marginTop = "-75px"; 
alertFram.style.width = "450px"; 
alertFram.style.height = "150px"; 
alertFram.style.background = "#ff0000"; 
alertFram.style.textAlign = "center"; 
alertFram.style.lineHeight = "150px"; 
alertFram.style.zIndex = "300"; 
strHtml = "<ul style=\"list-style:none;margin:0px;padding:0px;width:100%\">\n"; 
strHtml += " <li style=\"background:#DD828D;text-align:left;padding-left:20px;font-size:14px;font-weight:bold;height:25px;line-height:25px;border:1px solid #F9CADE;\">[自定义提示]</li>\n"; 
strHtml += " <li style=\"background:#fff;text-align:center;font-size:12px;height:120px;line-height:120px;border-left:1px solid #F9CADE;border-right:1px solid #F9CADE;\">"+str+"</li>\n"; 
strHtml += " <li style=\"background:#FDEEF4;text-align:center;font-weight:bold;height:25px;line-height:25px; border:1px solid #F9CADE;\"><input type=\"button\" value=\"确 定\" onclick=\"doOk()\" /></li>\n"; 
strHtml += "</ul>\n"; 
alertFram.innerHTML = strHtml; 
document.body.appendChild(alertFram); 
document.body.appendChild(shield); 
var ad = setInterval("doAlpha()",5); 
this.doOk = function(){ 
alertFram.style.display = "none"; 
shield.style.display = "none"; 
} 
alertFram.focus(); 
document.body.onselectstart = function(){return false;}; 
}

效果如图
js的alert样式如何更改如背景颜色
Javascript 相关文章推荐
对textarea框的代码调试,而且功能上使用非常方便,酷
Jun 30 Javascript
autoPlay 基于jquery的图片自动播放效果
Dec 07 Javascript
一个判断抢购时间是否到达的简单的js函数
Jun 23 Javascript
jQuery+ajax实现鼠标单击修改内容的思路
Jun 29 Javascript
JS正则表达式比较常见用法
Jan 26 Javascript
简介EasyUI datagrid editor combogrid搜索框的实现
Apr 01 Javascript
js严格模式总结(分享)
Aug 22 Javascript
js实现点击图片自动提交action的简单方法
Oct 16 Javascript
一句jQuery代码实现返回顶部效果(简单实用)
Dec 28 Javascript
vue组件间通信解析
Mar 01 Javascript
js实现计算器功能
Aug 10 Javascript
vue的$http的get请求要加上params操作
Nov 12 Javascript
javascript 获取网页标题代码实例
Jan 22 #Javascript
js完美的div拖拽实例代码
Jan 22 #Javascript
jquery中对于批量deferred的处理方法
Jan 22 #Javascript
jquery基础教程之deferred对象使用方法
Jan 22 #Javascript
jquery each的几种常用的使用方法示例
Jan 21 #Javascript
JavaScript在for循环中绑定事件解决事件参数不同的情况
Jan 20 #Javascript
javascript break指定标签打破多层循环示例
Jan 20 #Javascript
You might like
php使用ftp远程上传文件类(完美解决主从文件同步问题的方法)
2016/09/23 PHP
Prototype使用指南之dom.js
2007/01/10 Javascript
JavaScript DOM 学习第九章 选取范围的介绍
2010/02/19 Javascript
基于JQuery.timer插件实现一个计时器
2010/04/25 Javascript
jquery的extend和fn.extend的使用说明
2011/01/09 Javascript
淘宝搜索框效果实现分析
2011/03/05 Javascript
使用javascript实现ListBox左右全选,单选,多选,全请
2013/11/07 Javascript
javascript正则匹配汉字、数字、字母、下划线
2014/04/10 Javascript
this,this,再次讨论javascript中的this,超全面(经典)
2016/01/05 Javascript
getElementById().innerHTML与getElementById().value的区别
2016/10/27 Javascript
js实现日期显示的一些操作(实例讲解)
2017/07/27 Javascript
vue input 输入校验字母数字组合且长度小于30的实现代码
2018/05/16 Javascript
Angular父子组件通过服务传参的示例方法
2018/10/31 Javascript
基于jQuery拖拽事件的封装
2020/11/29 jQuery
[01:21]2018DOTA2亚洲邀请赛4.5采访 打DOTA2也能有女朋友?
2018/04/06 DOTA
[02:22]完美世界DOTA2联赛PWL S3 集锦第一期
2020/12/15 DOTA
python之文件的读写和文件目录以及文件夹的操作实现代码
2016/08/28 Python
Django基础之Model操作步骤(介绍)
2017/05/27 Python
Selenium元素的常用操作方法分析
2018/08/10 Python
Python解决pip install时出现的Could not fetch URL问题
2019/08/01 Python
python线程的几种创建方式详解
2019/08/29 Python
Ubuntu下Python+Flask分分钟搭建自己的服务器教程
2019/11/19 Python
利用Python如何实时检测自身内存占用
2020/05/09 Python
jupyter notebook 写代码自动补全的实现
2020/11/02 Python
标签和贴纸印刷:Lightning Labels
2018/03/22 全球购物
String和StringBuffer的区别
2015/08/13 面试题
主键(Primary Key)约束和唯一性(UNIQUE)约束的区别
2013/05/29 面试题
交通事故调解协议书
2014/04/16 职场文书
新闻工作者先进事迹
2014/05/26 职场文书
贸易经济专业自荐书
2014/06/29 职场文书
2014年商场工作总结
2014/11/22 职场文书
寒假安全保证书
2015/02/28 职场文书
保险内勤岗位职责
2015/04/13 职场文书
2015年采购员工作总结
2015/04/27 职场文书
毕业生捐书活动倡议书
2015/04/27 职场文书
门球健将观后感
2015/06/16 职场文书