How to change the alert style of JS, such as: Pop-up dialog box background color, background transparency and so on, below, interested friends can learn the next
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"; Background color when pop-up dialog shield.style.background = "#fff"; shield.style.textAlign = "center"; Shield.style.zIndex = "25"; Background transparent ie effective//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; \ ">[custom prompt]</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=\" OK \ "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;}; }
Effect
Modify the alert style in JavaScript